/*
Theme Name: とっとりネイチャーポジティブ推進プラットフォーム
Theme URI: https://example.com
Author: webもり
Description: とっとりネイチャーポジティブ推進プラットフォーム トップページ用オリジナルテーマ
Version: 1.0
Text Domain: tottori-np
*/

  :root{
    --forest:   #184A33;
    --forest-d: #0F3322;
    --leaf:     #8FBF1B;
    --leaf-d:   #6FA00F;
    --dune:     #EFE4C6;
    --dune-d:   #DDCB9E;
    --dune-l:   #FCF9F1;
    --sea:      #1F7A8C;
    --sea-l:    #4FA3B3;
    --sun:      #F5B400;
    --ink:      #1A1A1A;
    --white:    #FFFFFF;

    --tint-leaf:   #E9F2D9;
    --tint-sea:    #DCEEF1;
    --tint-sun:    #FDEFD2;
    --tint-forest: #E1E9E3;

    --font-display:'Zen Maru Gothic', sans-serif;
    --font-body:'Noto Sans JP', sans-serif;
    --font-label:'Zen Kaku Gothic New', sans-serif;

    --container: 1240px;
  }

  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;overflow-x:hidden;}
  body{
    font-family:var(--font-body);
    font-size:18px;
    color:var(--ink);
    background:var(--dune-l);
    line-height:1.85;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
    width:100%;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  ul{list-style:none;}
  .container{max-width:var(--container);margin:0 auto;padding:0 24px;}
  section{position:relative;}

  .eyebrow{
    display:inline-flex;align-items:center;gap:10px;
    font-family:var(--font-label);
    font-weight:700;
    font-size:14px;
    letter-spacing:.16em;
    color:var(--sea);
    margin-bottom:14px;
  }
  .eyebrow .ripple-mark{width:46px;height:12px;flex:none;}

  .section-title{
    font-family:var(--font-display);
    font-weight:900;
    font-size:clamp(24px,2.6vw,32px);
    color:var(--forest);
    line-height:1.5;
    margin-bottom:18px;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .section-head{text-align:center;max-width:760px;margin:0 auto 40px;}
  .section-head .eyebrow{justify-content:center;}

  /* ===================== Breadcrumb（サブページ共通） ===================== */
  .breadcrumb{background:var(--tint-forest);padding:16px 0;border-bottom:1px solid var(--dune-d);margin-top:30px;}
  .breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;font-family:var(--font-label);font-size:14px;color:var(--forest);}
  .breadcrumb a{color:var(--sea);transition:opacity .2s;}
  .breadcrumb a:hover{opacity:.7;}
  .breadcrumb li{display:flex;align-items:center;gap:8px;}
  .breadcrumb li:not(:last-child)::after{content:"";width:6px;height:6px;border-top:2px solid var(--leaf-d);border-right:2px solid var(--leaf-d);transform:rotate(45deg);display:inline-block;}
  .breadcrumb li[aria-current]{color:var(--ink);font-weight:500;}

  /* ===================== Page Header（サブページ共通） ===================== */
  .page-header{background:linear-gradient(160deg,var(--tint-leaf) 0%,var(--dune-l) 70%);padding:56px 0 48px;text-align:center;position:relative;overflow:hidden;}
  .page-header::before{content:"";position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;background:var(--tint-sun);opacity:.7;z-index:0;}
  .page-header::after{content:"";position:absolute;bottom:-80px;left:-60px;width:240px;height:240px;border-radius:50%;background:var(--tint-sea);opacity:.6;z-index:0;}
  .page-header-inner{position:relative;z-index:1;}
  .page-title{font-family:var(--font-display);font-weight:900;font-size:clamp(28px,4vw,42px);color:var(--forest);line-height:1.5;}
  @media (max-width:640px){
    .page-header{padding:44px 0 36px;}
  }

  /* ===================== Header ===================== */
  header.site-header{
    position:fixed;
    top:0;left:0;right:0;
    z-index:200;
    border-bottom:1px solid var(--dune-d);
  }
  body{
    padding-top:40px;
  }
  html{
    scroll-padding-top:40px;
  }
  .header-bg{
    position:absolute;inset:0;width:100%;height:100%;z-index:0;
  }
  .header-bg svg{width:100%;height:100%;display:block;}
  .header-tint{
    position:absolute;inset:0;z-index:1;
    background:rgba(248,242,226,.72);
  }
  .header-inner{
    position:relative;z-index:2;
    display:flex;align-items:center;justify-content:space-between;
    gap:20px;
    padding:18px 24px;
    max-width:1360px;margin:0 auto;
  }
  .brand{display:flex;align-items:center;gap:10px;flex:none;margin-right:auto;padding-right:40px;}
  .brand-text{font-family:var(--font-display);font-weight:900;color:var(--forest);line-height:1.3;}
  .brand-text strong{font-size:19px;}

  nav.main-nav{flex:none;}
  nav.main-nav ul{display:flex;align-items:center;gap:4px;}
  nav.main-nav a{
    font-family:var(--font-label);font-weight:500;font-size:17px;
    padding:8px 13px;border-radius:8px;color:var(--forest);
    transition:background .2s, color .2s;
    white-space:nowrap;
  }
  nav.main-nav a:hover{background:rgba(255,255,255,.7);}
  nav.main-nav a.nav-cta{
    background:var(--sun);color:var(--forest-d);font-weight:700;
    padding:12px 24px;border-radius:999px;margin-left:8px;
    font-size:16px;
  }
  nav.main-nav a.nav-cta:hover{background:#e0a600;color:var(--white);}

  .nav-toggle{display:none;flex-direction:column;align-items:center;gap:4px;background:none;border:none;cursor:pointer;padding:6px;position:relative;z-index:2;}
  .nav-toggle span{display:block;width:24px;height:2px;background:var(--forest);margin:3px 0;border-radius:2px;}
  .nav-toggle small{
    font-family:var(--font-label);font-weight:700;font-size:10px;
    color:var(--forest);letter-spacing:.05em;line-height:1;
    white-space:nowrap;
  }

  /* ===================== Hero ===================== */
  .hero{
    position:relative;
    overflow:hidden;
    background:#cfe7ef;
  }
  .hero img.hero-photo{
    width:100%;
    height:auto;
    aspect-ratio:1672/722;
    object-fit:cover;
    object-position:center center;
    display:block;
  }
  .hero-mascot{
    position:absolute;right:3%;bottom:3%;z-index:4;
    width:clamp(110px,11vw,170px);
    filter:drop-shadow(0 10px 14px rgba(15,51,34,.25));
  }

  .btn{
    display:inline-flex;align-items:center;gap:10px;
    font-family:var(--font-label);font-weight:700;font-size:18px;
    padding:17px 34px;border-radius:999px;
    transition:transform .18s ease, box-shadow .18s ease;
    border:2px solid transparent;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn-primary{background:var(--leaf);color:var(--forest-d);box-shadow:0 8px 20px rgba(111,160,15,.32);}
  .btn-primary:hover{background:var(--leaf-d);color:var(--white);}
  .btn-ghost{background:transparent;border-color:var(--forest);color:var(--forest);}
  .btn-ghost:hover{background:var(--forest);color:var(--white);}

  .ripple-divider{display:block;width:100%;height:auto;margin-top:-1px;position:relative;z-index:2;}

  /* ===================== About section ===================== */
  .about{background:var(--dune-l);padding:90px 0 76px;}
  .about-stack{display:flex;flex-direction:column;gap:34px;}
  .about-text{text-align:left;max-width:820px;margin:0 auto;}
  .about-heading{display:flex;align-items:flex-start;gap:24px;margin-bottom:4px;}
  .about-heading img{width:240px;height:auto;flex:none;order:2;margin-top:-30px;}
  .about-heading .section-title{margin-bottom:0;order:1;}
  .about-text p{margin-bottom:18px;font-size:18px;color:var(--ink);}
  .about-text p strong{color:var(--forest);}

  .decl-box{
    background:var(--white);
    border:1px solid var(--dune-d);
    border-radius:22px;
    padding:34px 32px;
    position:relative;
    max-width:820px;
    margin:0 auto;
  }
  .decl-box-head{margin-bottom:8px;}
  .decl-box-head h3{font-family:var(--font-display);font-weight:900;font-size:clamp(26px,2.8vw,34px);color:var(--forest);word-break:keep-all;overflow-wrap:break-word;}
  .decl-box>p.lead{font-size:18px;color:var(--ink);margin-bottom:24px;}

  .decl-list{display:flex;flex-direction:column;gap:18px;}
  .decl-item{
    display:flex;gap:20px;align-items:center;
    padding:20px;border-radius:14px;
    background:var(--dune-l);
    text-align:left;
  }
  .decl-item .num{
    flex:none;width:62px;height:62px;border-radius:50%;
    color:var(--white);
    display:flex;align-items:center;justify-content:center;
    font-family:var(--font-display);font-weight:900;font-size:26px;
    box-shadow:0 6px 14px rgba(0,0,0,.15);
  }
  .decl-item:nth-child(1) .num{background:var(--leaf-d);}
  .decl-item:nth-child(2) .num{background:var(--sea);}
  .decl-item:nth-child(3) .num{background:var(--sun);}
  .decl-item p{font-size:18px;color:var(--ink);line-height:1.75;}
  .decl-outer{max-width:820px;margin:0 auto;}
  .decl-outer .btn-row{display:flex;justify-content:center;margin-top:34px;}
  .decl-outer .btn-primary{color:var(--white);font-size:19px;padding:19px 38px;}

  /* ===================== News (eyecatch image + title) ===================== */
  .news{background:var(--white);padding:80px 0;}
  .news-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
  }
  .news-card{display:flex;flex-direction:column;gap:28px;}
  .news-eyecatch{
    aspect-ratio:4/3;border-radius:18px;
    overflow:hidden;
    background:var(--dune-l);
    margin-bottom:4px;
  }
  .news-eyecatch img{width:100%;height:100%;object-fit:cover;display:block;}
  .news-card h3{font-family:var(--font-label);font-weight:700;font-size:18px;color:var(--ink);line-height:1.6;}
  .news .btn-primary{color:var(--white);}

  /* ===================== Feature rows (subpage intro blocks) ===================== */
  .features{background:var(--dune-l);padding:86px 0 150px;}

  /* -- Highlighted style: members / cases -- */
  .feature-highlight{
    padding:100px 0;
    text-align:center;
    max-width:820px;
    margin:0 auto;
  }
  .feature-highlight + .feature-highlight{border-top:1px solid var(--dune-d);}
  .feature-highlight .feature-illust{
    width:128px;height:128px;margin:0 auto 18px;
  }
  .feature-highlight .feature-illust svg{width:100%;height:100%;}
  .feature-highlight h3{
    font-family:var(--font-display);font-weight:900;
    font-size:clamp(28px,3.4vw,38px);color:var(--forest);
    margin-bottom:18px;
  }
  .feature-highlight p{font-size:18px;color:var(--ink);margin-bottom:14px;text-align:left;}
  .feature-highlight p:last-of-type{margin-bottom:26px;}
  .feature-highlight .btn-row{display:flex;justify-content:center;}
  .feature-highlight .btn-primary{color:var(--white);}

  /* -- Distinct card style: links -- */
  .feature-row{
    padding:52px 44px;
    text-align:left;
    max-width:820px;
    margin:80px auto 0;
    background:var(--white);
    border:2px solid var(--dune-d);
    border-radius:22px;
  }
  .feature-row .feature-heading{
    display:flex;align-items:center;gap:14px;
    margin-bottom:14px;
  }
  .feature-row .feature-icon{
    flex:none;width:48px;height:48px;border-radius:12px;
    background:var(--tint-leaf);
    display:flex;align-items:center;justify-content:center;
  }
  .feature-row .feature-icon svg{width:26px;height:26px;}
  .feature-row h3{
    font-family:var(--font-display);font-weight:900;
    font-size:clamp(24px,2.4vw,28px);color:var(--forest);
  }
  .feature-row p{font-size:18px;color:var(--ink);margin-bottom:14px;}
  .feature-row p:last-of-type{margin-bottom:22px;}
  .feature-row .btn-primary{color:var(--white);}

  /* ===================== CTA band ===================== */
  .cta-band{
    background:var(--tint-leaf);
    color:var(--forest-d);
    padding:70px 0 130px;
    position:relative;
    overflow:hidden;
  }
  .cta-inner{
    display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
    position:relative;z-index:2;
  }
  .cta-inner h2{font-family:var(--font-display);font-weight:900;font-size:clamp(24px,2.8vw,32px);margin-bottom:10px;color:var(--forest);}
  .cta-inner p{font-size:18px;color:var(--forest-d);max-width:620px;margin-bottom:10px;}
  .cta-inner p:last-of-type{margin-bottom:0;}
  .cta-band .btn-primary{
    background:var(--sun);color:var(--forest-d);
    font-size:19px;padding:20px 40px;
    box-shadow:0 10px 26px rgba(245,180,0,.45);
  }
  .cta-band .btn-primary:hover{background:#e0a600;color:var(--white);}
  .cta-mascot{
    position:absolute;right:0;bottom:-10px;width:260px;opacity:.98;z-index:1;
    filter:drop-shadow(0 10px 14px rgba(0,0,0,.18));
  }

  /* ===================== Back to top ===================== */
  .back-to-top{
    position:fixed;
    right:24px;bottom:24px;
    width:52px;height:52px;
    border-radius:50%;
    background:var(--forest);
    color:var(--white);
    border:none;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 10px 22px rgba(15,51,34,.3);
    cursor:pointer;
    opacity:0;visibility:hidden;
    transform:translateY(10px);
    transition:opacity .25s ease, transform .25s ease, visibility .25s, background .2s;
    z-index:150;
  }
  .back-to-top svg{width:20px;height:20px;}
  .back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0);}
  .back-to-top:hover{background:var(--leaf-d);}
  @media(max-width:640px){
    .back-to-top{right:16px;bottom:16px;width:46px;height:46px;}
    .back-to-top svg{width:18px;height:18px;}
  }

  /* ===================== Footer ===================== */
  footer.site-footer{background:var(--forest-d);color:var(--white);padding:56px 0 30px;}
  .footer-brand{display:flex;align-items:center;margin-bottom:30px;}
  .footer-brand strong{font-family:var(--font-display);color:var(--white);font-size:18px;}
  .footer-nav{
    display:flex;flex-wrap:wrap;gap:10px 28px;
    margin-bottom:30px;
    padding-bottom:30px;
    border-bottom:1px solid #2A5440;
  }
  .footer-nav a{font-size:15px;color:var(--white);transition:opacity .2s;}
  .footer-office{
    font-size:13.5px;
    line-height:1.9;
    color:#C9D6CC;
    margin-bottom:30px;
    padding-bottom:30px;
    border-bottom:1px solid #2A5440;
  }
  .footer-nav a:hover{opacity:.75;}
  .footer-bottom{
    font-size:13.5px;color:var(--white);
    text-align:center;
    display:flex;flex-direction:column;gap:6px;
  }
  .footer-bottom .footer-credit{font-size:12px;color:#9FB3A4;}
  .footer-bottom a{color:var(--white);}
  .footer-bottom a:hover{opacity:.75;}
  .footer-credit a{color:#9FB3A4;text-decoration:underline;}
  .footer-credit a:hover{opacity:.75;}

  /* ===================== Responsive ===================== */
  @media (min-width:900px){
    .news-grid{grid-template-columns:repeat(5,1fr);}
  }
  @media (max-width:980px){
    nav.main-nav{position:fixed;inset:72px 0 0 0;background:var(--dune-l);z-index:99;
      transform:translateX(100%);transition:transform .25s ease;padding:24px;overflow-y:auto;}
    nav.main-nav.open{transform:translateX(0);}
    nav.main-nav ul{flex-direction:column;align-items:stretch;gap:4px;}
    nav.main-nav a{display:block;padding:15px 10px;font-size:17px;border-bottom:1px solid var(--dune-d);border-radius:0;}
    nav.main-nav a.nav-cta{margin:14px 0 0;text-align:center;border-bottom:none;border-radius:999px;}
    .nav-toggle{display:flex;}
    .hero-inner{min-height:560px;}
    .hero-mascot{width:46vw;}
  }
  @media (max-width:640px){
    .hero-inner{padding-top:48px;min-height:600px;}
    .hero-mascot{width:54vw;right:0;bottom:8px;}
    .hero img.hero-photo{aspect-ratio:900/999;}
    .cta-inner{justify-content:center;}
    .cta-inner p{text-align:left;}
    .cta-mascot{display:none;}
    .cta-band{padding-bottom:70px;}
    footer.site-footer{padding-bottom:90px;}
    .decl-box{padding:24px 20px;}
    .decl-item{padding:16px;gap:14px;}
    .decl-item .num{width:44px;height:44px;font-size:18px;}
    .decl-item p{font-size:15.5px;line-height:1.7;}
    .decl-box-head h3{font-size:24px;}
    .decl-box>p.lead{font-size:15.5px;}
    .news-grid{grid-template-columns:repeat(2,1fr);}
    .brand-text strong{font-size:16px;white-space:normal;}
    .brand-text{white-space:normal;}
    .brand-text small{font-size:10px;}
    .header-inner{padding:14px 20px;}
    .brand{min-width:0;flex:1 1 auto;}
    .about-heading{flex-direction:row;flex-wrap:wrap;gap:14px;}
    .about-heading img{width:100px;margin-top:0;}
    .feature-row{padding:28px 22px;}
  }