/*
Theme Name: Kitchen Energy OPR LP
Theme URI: https://kitchenenergy.jp/
Author: AIEI Plan
Description: キッチンエナジー大作戦の個人向け・事業者向けLPを /personal と /business で切り替えて表示するWordPressテーマ。
Version: 1.0.1
Text Domain: kitchenenergy-opr
*/

:root{
  --green-900:#0d5a33;
  --green-800:#16773f;
  --green-700:#20a84a;
  --logo-green:#20a84a;
  --logo-green-light:#54c65f;
  --green-500:#4fd266;
  --green-100:#eaf9ea;
  --orange-700:#ef8b00;
  --orange-500:#ffad21;
  --orange-100:#fff3d6;
  --ink-900:#173126;
  --ink-700:#456152;
  --line:#d7e7d7;
  --white:#ffffff;
  --shell:1180px;
  --shadow:0 24px 60px rgba(17,64,39,.12);
  --shadow-soft:0 16px 36px rgba(17,64,39,.08);
  --radius-xl:32px;
  --radius-lg:24px;
  --radius-md:18px;
  --radius-sm:14px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  position:relative;
  margin:0;
  min-width:320px;
  background:var(--page-bg, #f7fbf5);
  color:var(--ink-900);
  font-family:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

body::before{
  content:"";
  position:fixed;
  inset:auto -60px 10vh auto;
  z-index:-1;
  width:260px;
  height:360px;
  background:url("./img/site/aiei-drop.png") center / contain no-repeat;
  opacity:.07;
  transform:rotate(12deg);
  pointer-events:none;
}

img{display:block;max-width:100%}
figure{margin:0}
a{
  color:inherit;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease;
}

a:hover{transform:translateY(-1px)}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding-left:1.2rem}
[id]{scroll-margin-top:104px}

.theme-hub{
  --page-bg:
    radial-gradient(circle at top left, rgba(79,210,102,.16), transparent 34%),
    linear-gradient(180deg, #f8fff4 0%, #eff8ef 100%);
}

.theme-personal{
  --page-bg:
    radial-gradient(circle at 84% 18%, rgba(255,173,33,.18), transparent 20%),
    radial-gradient(circle at top left, rgba(255,173,33,.16), transparent 26%),
    radial-gradient(circle at top right, rgba(79,210,102,.18), transparent 24%),
    linear-gradient(180deg, #fbfff2 0%, #f5fbef 100%);
}

.theme-business{
  --page-bg:
    radial-gradient(circle at 82% 16%, rgba(255,173,33,.1), transparent 20%),
    radial-gradient(circle at top left, rgba(32,168,74,.1), transparent 26%),
    linear-gradient(180deg, #f5fbf7 0%, #edf5f2 100%);
}

.material-symbols-rounded{
  font-family:"Material Symbols Rounded";
  font-weight:normal;
  font-style:normal;
  font-size:1.25em;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  word-wrap:normal;
  direction:ltr;
  -webkit-font-feature-settings:"liga";
  -webkit-font-smoothing:antialiased;
  font-variation-settings:"FILL" 1, "wght" 650, "GRAD" 0, "opsz" 32;
}

.shell{
  width:min(calc(100% - 32px), var(--shell));
  margin:0 auto;
}

.site-header{
  position:sticky;
  top:0;
  z-index:40;
  backdrop-filter:blur(12px);
  background:rgba(255,255,255,.84);
  border-bottom:1px solid rgba(23,49,38,.08);
}

.header-inner{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:78px;
}

.brand{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
}

.brand img{
  display:block;
  width:122px;
  height:auto;
  aspect-ratio:240 / 87;
  object-fit:contain;
}

.header-nav{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:.9rem;
  color:var(--ink-700);
}

.header-nav a{
  padding:10px 10px;
  border-radius:999px;
  white-space:nowrap;
}

.header-nav a:hover{
  background:rgba(32,168,74,.08);
}

.header-cta{
  display:flex;
  flex:0 0 auto;
  gap:10px;
}

.mobile-menu{
  display:none;
  position:relative;
}

.mobile-menu summary{
  list-style:none;
}

.mobile-menu summary::-webkit-details-marker{
  display:none;
}

.mobile-menu-button{
  position:relative;
  width:52px;
  height:52px;
  display:block;
  border-radius:18px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(23,49,38,.12);
  box-shadow:0 12px 26px rgba(17,64,39,.1);
  cursor:pointer;
}

.mobile-menu-button span{
  position:absolute;
  left:15px;
  width:22px;
  height:2px;
  border-radius:999px;
  background:var(--green-900);
  transition:transform .2s ease, opacity .2s ease;
}

.mobile-menu-button span:nth-child(1){
  top:18px;
}

.mobile-menu-button span:nth-child(2){
  top:25px;
}

.mobile-menu-button span:nth-child(3){
  top:32px;
}

.mobile-menu[open] .mobile-menu-button span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}

.mobile-menu[open] .mobile-menu-button span:nth-child(2){
  opacity:0;
}

.mobile-menu[open] .mobile-menu-button span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}

.mobile-menu-panel{
  position:absolute;
  top:calc(100% + 12px);
  right:0;
  z-index:80;
  width:min(320px, calc(100vw - 24px));
  display:grid;
  gap:8px;
  padding:16px;
  border-radius:24px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(23,49,38,.1);
  box-shadow:0 26px 70px rgba(17,64,39,.2);
  backdrop-filter:blur(14px);
}

.mobile-menu-panel a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:46px;
  padding:0 14px;
  border-radius:16px;
  color:var(--green-900);
  font-weight:800;
}

.mobile-menu-panel a::after{
  content:"";
  width:8px;
  height:8px;
  border-top:2px solid rgba(13,90,51,.5);
  border-right:2px solid rgba(13,90,51,.5);
  transform:rotate(45deg);
}

.mobile-menu-panel a:hover{
  background:rgba(32,168,74,.08);
}

.mobile-menu-panel .mobile-menu-switch{
  margin-top:6px;
  background:linear-gradient(135deg, rgba(255,173,33,.18), rgba(32,168,74,.12));
  border:1px solid rgba(255,173,33,.22);
}

@media (max-width:1200px){
  .header-nav{
    display:none;
  }

  .mobile-menu{
    display:block;
  }
}

@media (max-width:700px){
  .header-cta{
    display:none;
  }
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:0 20px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:800;
  letter-spacing:.02em;
  text-align:center;
}

.btn-primary{
  background:linear-gradient(135deg, var(--orange-700) 0%, var(--orange-500) 100%);
  color:#fffdf7;
  box-shadow:0 18px 30px rgba(239,139,0,.22);
}

.btn-secondary{
  background:rgba(255,255,255,.8);
  color:var(--green-900);
  border-color:rgba(23,49,38,.12);
}

.btn-ghost{
  background:rgba(255,255,255,.12);
  color:#fff;
  border-color:rgba(255,255,255,.2);
}

.btn-link{
  color:var(--green-900);
  font-weight:800;
}

.hero{
  position:relative;
  overflow:hidden;
  padding:48px 0 34px;
}

.hero::before,
.hero::after{
  content:"";
  position:absolute;
  border-radius:999px;
  pointer-events:none;
}

.hero::before{
  width:320px;
  height:320px;
  left:-110px;
  top:60px;
  background:rgba(255,255,255,.18);
  filter:blur(6px);
}

.hero::after{
  width:360px;
  height:360px;
  right:-140px;
  bottom:-40px;
  background:rgba(255,255,255,.12);
  filter:blur(8px);
}

.hero-personal{
  color:#fff;
}

.hero-business{
  color:#fff;
}

.hero-photo-bg,
.hero-photo-overlay{
  position:absolute;
  inset:0;
}

.hero-photo-bg{
  transform:scale(1.03);
}

.hero-photo-bg--personal{
  background:
    linear-gradient(120deg, rgba(32,168,74,.1), rgba(255,173,33,.06)),
    url("./img/fv_personal-02.jpg") center center / cover no-repeat;
}

.hero-photo-bg--business{
  background:
    linear-gradient(120deg, rgba(32,168,74,.12), rgba(142,196,98,.06)),
    url("./img/fv_business-02.jpg") center center / cover no-repeat;
}

.hero-photo-bg--personal::before,
.hero-photo-bg--business::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  mix-blend-mode:soft-light;
}

.hero-photo-bg--personal::after,
.hero-photo-bg--business::after{
  content:"";
  position:absolute;
  inset:28px;
  border-radius:34px;
  border:1px dashed rgba(255,255,255,.18);
}

.hero-photo-overlay--personal{
  background:
    linear-gradient(90deg, rgba(32,168,74,.56) 0%, rgba(32,168,74,.4) 42%, rgba(32,168,74,.18) 70%, rgba(32,168,74,.28) 100%),
    linear-gradient(180deg, rgba(17,118,56,.16), rgba(17,118,56,.24));
}

.hero-photo-overlay--business{
  background:
    linear-gradient(90deg, rgba(27,145,70,.62) 0%, rgba(32,168,74,.45) 42%, rgba(32,168,74,.2) 70%, rgba(27,145,70,.3) 100%),
    linear-gradient(180deg, rgba(17,105,53,.16), rgba(17,105,53,.24));
}

.hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0, 1.02fr) minmax(320px, .98fr);
  gap:28px;
  align-items:center;
}

.hero-copy{
  padding:38px 0 48px;
}

.hero-callout{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:56px;
  padding:0 22px;
  border-radius:999px;
  background:rgba(255,255,255,.24);
  border:1px solid rgba(255,255,255,.32);
  box-shadow:0 16px 34px rgba(4,54,28,.16);
  backdrop-filter:blur(12px);
  font-size:1.1rem;
  font-weight:900;
  text-shadow:0 2px 14px rgba(5,45,24,.25);
}

.hero-callout .material-symbols-rounded{
  font-size:1.45rem;
  color:#fff3d6;
}

.hero h1{
  margin-top:18px;
  font-size:clamp(2.5rem, 5vw, 4.8rem);
  line-height:1.14;
  letter-spacing:.01em;
  text-shadow:0 3px 22px rgba(5,45,24,.32);
}

.theme-personal .hero h1{
  font-family:"M PLUS Rounded 1c","Zen Kaku Gothic New",sans-serif;
  font-weight:800;
}

.theme-business .hero h1{
  font-family:"Shippori Mincho","Hiragino Mincho ProN",serif;
  font-weight:700;
}

.hero-lead{
  margin-top:18px;
  max-width:680px;
  font-size:1.04rem;
  color:rgba(255,255,255,.92);
  text-shadow:0 2px 18px rgba(5,45,24,.28);
}

.cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px;
}

.pill-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  list-style:none;
  margin-top:22px;
  padding:0;
}

.pill-list li{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.16);
  font-size:.92rem;
  text-shadow:0 2px 12px rgba(5,45,24,.24);
}

.visual-stack{
  display:grid;
  gap:16px;
  padding:24px 0 30px;
}

.hero-side-card{
  padding:22px 24px;
  border-radius:26px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 20px 40px rgba(10,52,27,.14);
  backdrop-filter:blur(12px);
}

.hero-side-card > span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,243,214,.94);
  color:#916000;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.08em;
}

.hero-side-card .material-symbols-rounded{
  font-size:1rem;
}

.hero-side-card strong{
  display:block;
  margin-top:14px;
  font-size:1.24rem;
  line-height:1.5;
  color:#fff;
}

.hero-side-card p{
  margin-top:10px;
  color:rgba(255,255,255,.88);
}

.photo-panel,
.hero-note,
.stat-slab,
.section-card,
.store-card,
.faq-item,
.contact-panel,
.dummy-contact-form,
.entry-card,
.list-card,
.compare-card,
.banner-card,
.footer-card{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.3);
  box-shadow:var(--shadow);
}

.photo-panel{
  position:relative;
  overflow:hidden;
  min-height:360px;
  border-radius:36px;
  color:#fff;
}

.photo-panel img,
.placeholder-visual{
  width:100%;
  height:100%;
  min-height:360px;
  display:block;
}

.photo-panel img{
  object-fit:cover;
}

.photo-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(10,52,27,.04) 0%, rgba(10,52,27,.28) 45%, rgba(10,52,27,.54) 100%);
}

.photo-personal img{
  object-position:center 48%;
}

.photo-business img{
  object-position:center center;
}

.photo-placeholder{
  background:#f4f7ef;
}

.placeholder-visual{
  position:relative;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.78), transparent 20%),
    radial-gradient(circle at 82% 28%, rgba(255,255,255,.36), transparent 24%),
    linear-gradient(135deg, rgba(255,255,255,.34), rgba(255,255,255,.04)),
    linear-gradient(135deg, #b7d85b 0%, #67c24b 34%, #1f9447 68%, #0d6a3d 100%);
}

.photo-placeholder .placeholder-visual::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.18) 0 32%, transparent 32% 100%),
    linear-gradient(180deg, transparent 0 62%, rgba(255,255,255,.12) 62% 100%);
  mix-blend-mode:soft-light;
}

.photo-placeholder .placeholder-visual::after{
  content:"";
  position:absolute;
  inset:20px;
  border-radius:26px;
  border:2px dashed rgba(255,255,255,.36);
}

.photo-personal.photo-placeholder .placeholder-visual{
  background:
    radial-gradient(circle at 20% 18%, rgba(255,255,255,.72), transparent 18%),
    radial-gradient(circle at 78% 30%, rgba(255,241,194,.34), transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.08)),
    linear-gradient(135deg, #ffd66e 0%, #8bd652 38%, #46b943 72%, #17904a 100%);
}

.photo-business.photo-placeholder .placeholder-visual{
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.42), transparent 18%),
    radial-gradient(circle at 80% 68%, rgba(255,227,153,.22), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04)),
    linear-gradient(135deg, #1a6f45 0%, #21884d 36%, #5bb35a 72%, #9fd366 100%);
}

.photo-caption{
  position:absolute;
  left:22px;
  right:22px;
  bottom:22px;
  z-index:1;
  padding:18px 20px;
  border-radius:24px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
}

.photo-caption span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(255,243,214,.92);
  color:#966100;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.08em;
}

.photo-caption strong{
  display:block;
  margin-top:12px;
  font-size:1.55rem;
  line-height:1.45;
}

.photo-caption p{
  margin-top:10px;
  color:rgba(255,255,255,.9);
}

.hero-note{
  display:grid;
  gap:10px;
  padding:20px 22px;
  border-radius:24px;
  background:rgba(255,255,255,.9);
}

.hero-note span{
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.08em;
  color:#8f6300;
}

.hero-note strong{
  font-size:1.2rem;
  color:var(--green-900);
}

.hero-note p{
  color:var(--ink-700);
}

.area-ribbon{
  padding:18px 0;
  background:rgba(255,255,255,.84);
  border-top:1px solid rgba(23,49,38,.08);
  border-bottom:1px solid rgba(23,49,38,.08);
}

.ribbon-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.ribbon-title{
  font-size:1rem;
  font-weight:800;
  color:var(--green-900);
}

.ribbon-copy{
  color:var(--ink-700);
}

.section{
  padding:92px 0;
}

.section-soft{
  background:linear-gradient(180deg, rgba(255,255,255,.5), rgba(255,255,255,.14));
}

.section-head .eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(32,168,74,.08);
  color:var(--green-900);
  border:1px solid rgba(32,168,74,.12);
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.08em;
}

.section-head h2{
  margin-top:16px;
  font-size:clamp(2rem, 3.4vw, 3.1rem);
  line-height:1.28;
}

.section-head p{
  margin-top:14px;
  color:var(--ink-700);
}

.card-grid{
  display:grid;
  gap:18px;
  margin-top:32px;
}

.grid-3{grid-template-columns:repeat(3, minmax(0, 1fr))}
.grid-4{grid-template-columns:repeat(4, minmax(0, 1fr))}
.grid-2{grid-template-columns:repeat(2, minmax(0, 1fr))}

.section-card,
.list-card,
.compare-card{
  position:relative;
  overflow:hidden;
  padding:26px;
  border-radius:26px;
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow-soft);
}

.section-card::before,
.scenario-card::before{
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  right:-42px;
  top:-44px;
  border-radius:50%;
  background:rgba(255,173,33,.12);
  pointer-events:none;
}

.section-card h3,
.list-card h3,
.compare-card h3{
  font-size:1.24rem;
  line-height:1.4;
}

.section-card p,
.list-card p,
.compare-card p{
  margin-top:10px;
  color:var(--ink-700);
}

.card-icon{
  width:62px;
  height:62px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(79,210,102,.28), rgba(255,173,33,.26));
  font-size:1.65rem;
  font-weight:900;
  color:var(--green-900);
}

.card-icon .material-symbols-rounded{
  font-size:2rem;
}

.flow-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:18px;
  margin-top:34px;
}

.flow-step{
  position:relative;
  overflow:hidden;
  min-height:240px;
  padding:28px 24px;
  border-radius:28px;
  background:
    radial-gradient(circle at 88% 18%, rgba(255,173,33,.11), transparent 34%),
    var(--white);
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow-soft);
}

.flow-step::before{
  content:attr(data-flow-icon);
  position:absolute;
  right:14px;
  bottom:-34px;
  z-index:0;
  color:rgba(32,168,74,.085);
  font-family:"Material Symbols Rounded";
  font-size:8.5rem;
  font-weight:normal;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  white-space:nowrap;
  pointer-events:none;
  font-variation-settings:"FILL" 1, "wght" 650, "GRAD" 0, "opsz" 48;
}

.theme-business .flow-step::before{
  color:rgba(32,168,74,.075);
}

.flow-step::after{
  content:"";
  position:absolute;
  right:-11px;
  top:calc(50% - 1px);
  width:22px;
  height:2px;
  background:rgba(32,168,74,.28);
}

.flow-step:last-child::after{display:none}

.flow-step .step{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--green-700), var(--green-500));
  color:#fff;
  font-size:.86rem;
  font-weight:900;
}

.flow-step h3{
  position:relative;
  z-index:1;
  margin-top:26px;
  font-size:1.18rem;
}

.flow-step p{
  position:relative;
  z-index:1;
  margin-top:10px;
  color:var(--ink-700);
}

.scenario-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
  margin-top:34px;
}

.scenario-card{
  position:relative;
  overflow:hidden;
  padding:24px;
  border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(250,255,245,.9));
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow-soft);
}

.scenario-photo{
  position:relative;
  overflow:hidden;
  height:190px;
  margin:-10px -10px 18px;
  border-radius:22px;
  background:#eaf4e7;
}

.scenario-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.theme-business .scenario-photo img{
  object-position:center center;
}

.scenario-tag{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(79,210,102,.16);
  color:var(--green-900);
  font-size:.8rem;
  font-weight:800;
}

.scenario-card h3{
  margin-top:14px;
  font-size:1.24rem;
}

.scenario-card p{
  margin-top:10px;
  color:var(--ink-700);
}

.compare-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
  margin-top:34px;
}

.compare-card.is-before{
  background:linear-gradient(180deg, #ffffff, #f4f6f4);
}

.compare-card.is-after{
  background:linear-gradient(180deg, #f7fff7, #effbef);
  border-color:rgba(32,168,74,.18);
}

.compare-card ul{
  margin-top:14px;
  color:var(--ink-700);
}

.photo-strip-section{
  position:relative;
  z-index:2;
  margin-top:28px;
}

.photo-strip{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}

.photo-tile{
  position:relative;
  overflow:hidden;
  min-height:230px;
  border-radius:30px;
  background:#eff8ec;
  box-shadow:0 20px 46px rgba(17,64,39,.14);
}

.photo-tile-large{
  min-height:290px;
}

.photo-tile img{
  width:100%;
  height:100%;
  min-height:inherit;
  object-fit:cover;
  transition:transform .35s ease;
}

.photo-tile:hover img{
  transform:scale(1.04);
}

.photo-tile::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(10,52,27,.02) 20%, rgba(10,52,27,.62) 100%);
}

.photo-tile-copy{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:1;
  color:#fff;
  text-shadow:0 2px 18px rgba(5,45,24,.36);
}

.photo-tile-copy > span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:32px;
  padding:0 11px;
  border-radius:999px;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(8px);
  font-size:.8rem;
  font-weight:900;
}

.photo-tile-copy .material-symbols-rounded{
  font-size:1rem;
}

.photo-tile-copy strong{
  display:block;
  margin-top:10px;
  font-size:1.22rem;
  line-height:1.45;
}

.store-layout{
  display:grid;
  grid-template-columns:minmax(0, .94fr) minmax(300px, .76fr);
  gap:24px;
  align-items:start;
  margin-top:34px;
}

.store-grid{
  display:grid;
  gap:16px;
}

.store-card{
  padding:24px;
  border-radius:24px;
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow-soft);
}

.store-card h3{
  font-size:1.18rem;
}

.store-meta{
  display:grid;
  gap:8px;
  margin-top:12px;
  color:var(--ink-700);
  font-size:.96rem;
}

.store-note{
  margin-top:14px;
  font-size:.88rem;
  color:#7d6241;
}

.list-card ul{
  display:grid;
  gap:10px;
  margin-top:14px;
  color:var(--ink-700);
}

.area-board{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 320px;
  gap:24px;
  align-items:center;
  margin-top:34px;
}

.banner-card{
  padding:28px;
  border-radius:30px;
  border:1px solid rgba(23,49,38,.08);
}

.map-dummy{
  min-height:260px;
  padding:26px;
  border-radius:28px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.86), rgba(232,255,226,.68)),
    url("./img/site/aiei-grass.jpg") center / cover no-repeat;
  border:1px dashed rgba(23,49,38,.16);
  box-shadow:var(--shadow-soft);
}

.map-dummy strong{
  display:block;
  font-size:1.24rem;
  color:var(--green-900);
}

.map-dummy p{
  margin-top:10px;
  max-width:260px;
  color:var(--ink-700);
}

.recruit-banner{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:18px;
  align-items:center;
  margin-top:34px;
  padding:28px 30px;
  border-radius:30px;
  background:linear-gradient(135deg, rgba(13,90,51,.96), rgba(32,168,74,.9));
  color:#fff;
  box-shadow:0 22px 48px rgba(13,90,51,.22);
}

.recruit-banner p{
  margin-top:10px;
  color:rgba(255,255,255,.88);
}

.faq-grid{
  display:grid;
  gap:14px;
  margin-top:32px;
}

.faq-item{
  padding:22px 24px;
  border-radius:22px;
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow-soft);
}

.faq-item summary{
  cursor:pointer;
  list-style:none;
  position:relative;
  padding-right:28px;
  font-weight:800;
}

.faq-item summary::-webkit-details-marker{display:none}

.faq-item summary::after{
  content:"+";
  position:absolute;
  right:0;
  top:-2px;
  color:var(--orange-700);
  font-size:1.3rem;
  line-height:1;
}

.faq-item[open] summary::after{content:"-"}

.faq-item p{
  margin-top:14px;
  color:var(--ink-700);
}

.contact-section{
  position:relative;
  overflow:hidden;
}

.contact-section::before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:-120px;
  top:80px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(84,198,95,.22), transparent 68%);
  pointer-events:none;
}

.contact-panel{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, .82fr) minmax(360px, 1fr);
  gap:28px;
  align-items:start;
  padding:34px;
  border-radius:34px;
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow);
}

.contact-panel--personal{
  background:
    radial-gradient(circle at 8% 8%, rgba(255,173,33,.18), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(242,255,235,.94));
}

.contact-panel--business{
  background:
    radial-gradient(circle at 10% 12%, rgba(84,198,95,.18), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(239,249,242,.94));
}

.contact-copy .eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(32,168,74,.1);
  color:var(--green-900);
  border:1px solid rgba(32,168,74,.14);
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.08em;
}

.contact-copy h2{
  margin-top:16px;
  font-size:clamp(2rem, 3.2vw, 3rem);
  line-height:1.32;
}

.contact-copy p{
  margin-top:14px;
  color:var(--ink-700);
}

.contact-note-list{
  display:grid;
  gap:10px;
  margin-top:22px;
}

.contact-note-list span{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:var(--green-900);
  font-weight:800;
}

.contact-note-list span::before{
  content:"";
  flex:0 0 auto;
  width:10px;
  height:10px;
  margin-top:.68em;
  border-radius:50%;
  background:linear-gradient(135deg, var(--logo-green), var(--orange-500));
  box-shadow:0 0 0 5px rgba(32,168,74,.1);
}

.dummy-contact-form{
  padding:24px;
  border-radius:26px;
  border:1px solid rgba(23,49,38,.08);
  box-shadow:var(--shadow-soft);
}

.form-status{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,173,33,.14);
  color:#8b5d00;
  font-size:.82rem;
  font-weight:800;
}

.form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  margin-top:18px;
  align-items:start;
}

.form-grid > p{
  display:contents;
}

.form-field{
  display:grid;
  gap:7px;
  color:var(--ink-700);
  font-size:.9rem;
  font-weight:800;
  min-width:0;
}

.form-field-full{
  grid-column:1 / -1;
}

.form-field input,
.form-field select,
.form-field textarea{
  width:100%;
  border:1px solid rgba(23,49,38,.14);
  border-radius:16px;
  background:#fff;
  color:var(--ink-900);
  font:inherit;
  font-weight:500;
  padding:13px 14px;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease;
}

.form-field .wpcf7-form-control-wrap{
  display:block;
  width:100%;
  min-width:0;
}

.dummy-contact-form br{
  display:none;
}

.form-field textarea{
  resize:vertical;
  min-height:132px;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  border-color:rgba(32,168,74,.56);
  box-shadow:0 0 0 4px rgba(32,168,74,.12);
}

.form-consent{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:16px;
  color:var(--ink-700);
  font-size:.92rem;
  font-weight:700;
}

.form-consent input{
  width:18px;
  height:18px;
  accent-color:var(--logo-green);
}

.form-consent a{
  color:var(--green-900);
  text-decoration:underline;
  text-underline-offset:3px;
}

.form-consent .wpcf7-form-control-wrap,
.form-consent .wpcf7-acceptance,
.form-consent .wpcf7-list-item{
  display:block;
  margin:0;
}

.form-consent .wpcf7-list-item label{
  display:flex;
  align-items:center;
  gap:10px;
}

.form-consent .wpcf7-list-item-label{
  display:inline-block;
}

.dummy-contact-form .wpcf7-not-valid-tip{
  margin-top:6px;
  color:#b53426;
  font-size:.82rem;
  font-weight:800;
}

.dummy-contact-form .btn{
  margin-top:18px;
}

.dummy-contact-form .wpcf7-submit{
  margin-top:18px;
}

.dummy-contact-form .wpcf7-spinner{
  margin-top:18px;
}

.dummy-contact-form > p{
  margin:0;
}

.dummy-contact-form .form-grid > p{
  margin:0;
}

.dummy-contact-form .form-grid > p:empty{
  display:none;
}

.dummy-contact-form .wpcf7-response-output{
  margin:18px 0 0;
  padding:12px 14px;
  border-radius:16px;
  font-weight:800;
}

.page-footer{
  padding:40px 0 56px;
}

.footer-card{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:16px;
  align-items:center;
  padding:22px 24px;
  border-radius:24px;
  border:1px solid rgba(23,49,38,.08);
}

.footer-brand{
  display:flex;
  align-items:center;
  gap:14px;
}

.footer-brand img{height:38px}

.footer-copy{
  color:var(--ink-700);
  font-size:.94rem;
}

.footer-links{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.back-to-top{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:70;
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border:0;
  border-radius:999px;
  background:linear-gradient(135deg, var(--orange-700), var(--orange-500));
  color:#fff;
  box-shadow:0 18px 42px rgba(239,139,0,.34);
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(14px) scale(.92);
  transition:opacity .24s ease, visibility 0s linear .24s, transform .24s ease, box-shadow .24s ease;
}

.back-to-top span{
  display:grid;
  place-items:center;
  width:1em;
  height:1em;
  font-size:2.05rem;
  font-variation-settings:"FILL" 1, "wght" 700, "GRAD" 0, "opsz" 32;
  line-height:1;
  overflow:hidden;
  transform:translateY(-1px);
}

.back-to-top:hover{
  box-shadow:0 22px 52px rgba(239,139,0,.42);
  transform:translateY(10px) scale(.98);
}

.back-to-top.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
  transition:opacity .24s ease, transform .24s ease, box-shadow .24s ease;
}

.back-to-top.is-visible:hover{
  transform:translateY(-2px) scale(1.02);
}

.privacy-modal{
  position:fixed;
  inset:0;
  z-index:90;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(8,32,20,.56);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility 0s linear .22s;
}

.privacy-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .22s ease;
}

.privacy-modal__panel{
  position:relative;
  width:min(920px, 100%);
  max-height:min(82vh, 760px);
  overflow:auto;
  padding:34px;
  border-radius:30px;
  background:linear-gradient(180deg, #fffdf8, #f8fff2);
  box-shadow:0 30px 90px rgba(4,32,18,.28);
}

.privacy-modal__close{
  position:absolute;
  top:18px;
  right:18px;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:0;
  border-radius:999px;
  background:rgba(32,168,74,.1);
  color:var(--green-900);
  font-size:1.7rem;
  line-height:1;
  cursor:pointer;
}

.privacy-modal h2{
  margin-top:14px;
  padding-right:46px;
  font-size:clamp(1.8rem, 3vw, 2.6rem);
  line-height:1.28;
}

.privacy-modal p{
  margin-top:14px;
  color:var(--ink-700);
}

.privacy-modal__body{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
  margin-top:22px;
}

.privacy-modal__body section{
  padding:18px;
  border:1px solid rgba(32,168,74,.12);
  border-radius:20px;
  background:rgba(255,255,255,.72);
}

.privacy-modal__body h3{
  font-size:1rem;
  color:var(--green-900);
}

.privacy-modal__body p{
  margin-top:8px;
  font-size:.94rem;
}

.privacy-modal__note{
  padding-top:16px;
  border-top:1px solid rgba(32,168,74,.12);
}

.privacy-modal__note a{
  color:var(--green-900);
  font-weight:900;
  text-decoration:underline;
  text-underline-offset:3px;
}

body.has-modal-open{
  overflow:hidden;
}

.hub-main{
  min-height:calc(100vh - 78px);
  display:grid;
  place-items:center;
}

.hub-hero{
  width:100%;
  padding:54px 0 72px;
}

.hub-badge{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(32,168,74,.1);
  color:var(--green-900);
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.08em;
}

.hub-hero h1{
  margin-top:18px;
  font-family:"M PLUS Rounded 1c","Zen Kaku Gothic New",sans-serif;
  font-size:clamp(2.5rem, 4.8vw, 4.6rem);
  line-height:1.2;
}

.hub-lead{
  margin-top:18px;
  max-width:720px;
  color:var(--ink-700);
  font-size:1.05rem;
}

.entry-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:20px;
  margin-top:34px;
}

.entry-card{
  padding:30px;
  border-radius:30px;
  border:1px solid rgba(23,49,38,.08);
}

.entry-personal{
  background:linear-gradient(180deg, #fffef4, #f8fff3);
}

.entry-business{
  background:linear-gradient(180deg, #f7fbf9, #eef5f1);
}

.entry-kicker{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,173,33,.16);
  color:#996200;
  font-size:.8rem;
  font-weight:800;
}

.entry-card h2{
  margin-top:16px;
  font-size:1.8rem;
}

.entry-card p{
  margin-top:12px;
  color:var(--ink-700);
}

.entry-link{
  display:inline-flex;
  margin-top:20px;
  font-weight:800;
  color:var(--green-900);
}

@media (max-width:1080px){
  .hero-grid,
  .store-layout,
  .area-board,
  .recruit-banner,
  .contact-panel,
  .footer-card{
    grid-template-columns:1fr;
  }

  .header-nav{
    display:none;
  }

  .mobile-menu{
    display:block;
  }

  .grid-4{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .grid-3,
  .scenario-grid,
  .flow-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .photo-strip{
    grid-template-columns:1fr 1fr;
  }

  .photo-tile-large{
    grid-column:1 / -1;
  }

  .entry-grid{
    grid-template-columns:1fr;
  }

  .flow-step:nth-child(2)::after,
  .flow-step:last-child::after{
    display:none;
  }
}

@media (max-width:820px){
  .hero{
    padding-top:30px;
  }

  .hero-grid,
  .grid-2,
  .compare-grid,
  .scenario-grid,
  .grid-3,
  .grid-4,
  .flow-grid{
    grid-template-columns:1fr;
  }

  .flow-step::after{
    display:none;
  }
}

@media (max-width:640px){
  .shell{
    width:min(calc(100% - 24px), var(--shell));
  }

  .header-cta{
    display:none;
  }

  .hero-copy{
    padding:12px 0 24px;
  }

  .hero-callout{
    min-height:auto;
    padding:11px 15px;
    border-radius:22px;
    font-size:.96rem;
  }

  .hero h1{
    font-size:2.4rem;
  }

  .section{
    padding:74px 0;
  }

  .cta-row{
    flex-direction:column;
    align-items:stretch;
  }

  .pill-list{
    flex-direction:column;
  }

  .photo-strip-section{
    margin-top:22px;
  }

  .photo-tile,
  .photo-tile-large{
    min-height:220px;
    border-radius:24px;
  }

  .scenario-photo{
    height:170px;
  }

  .ribbon-inner{
    flex-direction:column;
    align-items:flex-start;
  }

  .footer-links{
    flex-direction:column;
    align-items:flex-start;
  }

  .back-to-top{
    right:16px;
    bottom:16px;
    width:48px;
    height:48px;
  }

  .back-to-top span{
    font-size:1.85rem;
  }

  .privacy-modal{
    padding:14px;
  }

  .privacy-modal__panel{
    max-height:86vh;
    padding:24px;
    border-radius:24px;
  }

  .privacy-modal__body{
    grid-template-columns:1fr;
  }

  .contact-panel,
  .dummy-contact-form{
    padding:22px;
    border-radius:24px;
  }

  .form-grid{
    grid-template-columns:1fr;
  }
}

.grecaptcha-badge {
    visibility: hidden !important;
}