/*
Theme Name: ICICaファーム
Theme URI: https://example.com
Author: 
Description: 子供たちの未来を守る。おいしい日本の食をつなぐ。無農薬栽培と国産チャレンジ作物、苗販売を紹介する農家サイト用テーマ。
Version: 1.2
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: yuinohatake
*/

:root{
  --moss:#FAF7EC;
  --moss-deep:#F1ECDC;
  --forest:#5C8A52;
  --forest-light:#8FBE7E;
  --forest-deep:#3E6B3B;
  --soil:#B07A45;
  --mango:#F4B942;
  --mango-deep:#DDA02E;
  --ink:#2B3A28;
  --paper:#FFFFFF;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--moss);
  color:var(--ink);
  font-family:'Zen Maru Gothic', sans-serif;
  font-weight:400;
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.mincho{
  font-family:'Kiwi Maru', serif;
  letter-spacing:.04em;
}
a{color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px;}

/* ---------- Header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 32px;
  background:linear-gradient(180deg, rgba(62,107,59,.55), rgba(62,107,59,0));
  color:#fff;
}
.logo a{
  font-family:'Kiwi Maru', serif;
  font-size:20px;font-weight:600;letter-spacing:.12em;
  text-decoration:none;color:#fff;
  text-shadow:0 2px 10px rgba(30,50,28,.35);
}
.logo span{color:#fff;font-weight:800;}
.site-header nav{display:flex;gap:28px;font-size:13px;letter-spacing:.08em;}
.site-header nav a,.fallback-nav a{text-decoration:none;opacity:.92;color:#fff;margin-right:28px;}
.site-header nav ul{list-style:none;display:flex;margin:0;padding:0;gap:28px;}
.site-header nav ul li a{text-decoration:none;color:#fff;opacity:.92;}
.cart-btn{
  background:var(--mango);color:var(--forest-deep);
  padding:9px 18px;border-radius:2px;font-size:13px;letter-spacing:.06em;
  text-decoration:none;font-weight:700;
}

/* ヘッダーの「購入する」ボタンだけ、丸い楕円形に */
.site-header .cart-btn{
  border-radius:999px;
  padding:10px 26px;
}
.site-header .cart-btn:hover{
  transform:translateY(-2px);
}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:100vh;
  display:flex;align-items:flex-end;
  background:linear-gradient(120deg, #8FBE7E 0%, #5C8A52 55%, #3E6B3B 100%);
  color:#fff;
  overflow:hidden;
}
.hero-photo{position:absolute;inset:0;z-index:0;overflow:hidden;}
.hero-slide{
  position:absolute;inset:0;overflow:hidden;
  transform:translateX(100%);
  transition:transform 1.5s cubic-bezier(.65,0,.35,1);
}
.hero-slide.is-active{transform:translateX(0);z-index:2;}
.hero-slide.is-prev{transform:translateX(-100%);z-index:1;}
.hero-slide img{
  width:100%;height:100%;object-fit:cover;object-position:center 35%;
  animation:hero-kenburns 22s ease-in-out infinite alternate;
}
.hero-slide img.img-watering-child{object-position:center 15%;}
.hero-slide img.img-broccoli-child{object-position:center 10%;}
@media (min-width:900px){
  .hero-slide img.img-watering-child{object-position:center 0%;}
  .hero-slide img.img-greenhouse{object-position:center 90%;}
  .hero-slide img.img-broccoli-child{object-position:center 0%;}
}
@keyframes hero-kenburns{
  0%{transform:scale(1) translate(0,0);}
  100%{transform:scale(1.09) translate(-1%,-1%);}
}
.hero-in{opacity:0;filter:blur(8px);transform:translateY(40px);animation:hero-fade-up 2.2s cubic-bezier(.19,1,.22,1) forwards;}
.hero-in-1{animation-delay:.3s;}
.hero-in-2{animation-delay:.7s;}
.hero-in-3{animation-delay:1.2s;}
.hero-in-4{animation-delay:1.9s;}
@keyframes hero-fade-up{
  to{opacity:1;filter:blur(0);transform:translateY(0);}
}
@media (prefers-reduced-motion: reduce){
  .hero-slide{transition:none;}
  .hero-slide img{animation:none;}
  .hero-in{animation:none;opacity:1;filter:none;transform:none;}
}
.hero-scrim{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg, rgba(62,107,59,.18) 0%, rgba(40,74,38,.72) 92%),
    linear-gradient(90deg, rgba(62,107,59,.55) 0%, rgba(62,107,59,.10) 60%);
}
.hero::before{
  content:"";
  position:absolute;inset:0;z-index:1;
  background-image:
    radial-gradient(circle at 18% 25%, rgba(244,185,66,.20), transparent 40%),
    radial-gradient(circle at 82% 70%, rgba(244,185,66,.12), transparent 45%);
}
.hero-rows{
  position:absolute;inset:0;z-index:1;
  background-image:repeating-linear-gradient(
    100deg,
    transparent 0 68px,
    rgba(255,255,255,.05) 68px 71px
  );
}
.hero-inner{position:relative;z-index:2;width:100%;padding-bottom:96px;}
.eyebrow{
  display:flex;align-items:center;gap:10px;
  font-size:12px;letter-spacing:.28em;color:var(--mango);
  margin-bottom:22px;
}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--mango);}
.hero .eyebrow{color:#D9A466;text-shadow:0 1px 6px rgba(30,40,20,.55);}
.hero .eyebrow::before{background:#D9A466;}
.hero h1{
  font-size:clamp(20px,6vw,54px);
  font-weight:800;line-height:1.65;margin:0 0 28px;
  max-width:820px;
  text-shadow:0 2px 18px rgba(30,50,28,.35);
}
.hero p{max-width:520px;font-size:15px;color:rgba(255,255,255,.95);margin-bottom:0;text-shadow:0 1px 10px rgba(30,50,28,.3);}
.scroll-cue{
  position:absolute;right:32px;bottom:36px;z-index:3;
  writing-mode:vertical-rl;color:rgba(255,255,255,.7);
  font-size:11px;letter-spacing:.3em;display:flex;align-items:center;gap:10px;
}
.scroll-cue::after{content:"";width:1px;height:46px;background:rgba(255,255,255,.6);}

/* ---------- Section shared ---------- */
section{padding:120px 0;position:relative;}
.page-banner{padding:190px 0 80px;background:var(--moss-deep);}
.page-banner .eyebrow{color:var(--soil);}
.page-banner .eyebrow::before{background:var(--soil);}
.page-banner h1{font-size:clamp(26px,3.6vw,40px);margin:0;color:var(--forest-deep);font-weight:600;}
.section-head{max-width:640px;margin-bottom:64px;}
.section-head .eyebrow{color:var(--soil);}
.section-head .eyebrow::before{background:var(--soil);}
.section-head h2{font-size:clamp(24px,3vw,34px);font-weight:600;margin:0 0 18px;color:var(--forest-deep);}
.section-head p{font-size:14.5px;color:#556449;max-width:540px;}

/* concept quote */
.concept{background:var(--paper);}
.concept blockquote{
  margin:0;font-family:'Kiwi Maru',serif;
  font-size:clamp(22px,3.2vw,36px);line-height:2;
  color:var(--forest-deep);font-weight:600;
  border-left:2px solid var(--mango);padding-left:36px;
}
.concept-note{margin-top:36px;padding-left:38px;font-size:13.5px;color:#5c6754;max-width:600px;}

/* commitments - furrow rows */
#commit{position:relative;overflow:hidden;scroll-margin-top:90px;}
.commit-photo-bg{position:absolute;inset:0;z-index:0;}
.commit-photo-bg img{width:100%;height:100%;object-fit:cover;object-position:center;}
.commit-photo-bg::after{
  content:"";position:absolute;inset:0;
  background:rgba(250,247,236,.88);
}
#commit .wrap{position:relative;z-index:1;}
.commit-row{
  display:grid;grid-template-columns:120px 1fr;gap:0 40px;
  border-top:1px solid rgba(62,107,59,.22);
  padding:44px 0;align-items:start;
}
.commit-row:last-child{border-bottom:1px solid rgba(62,107,59,.22);}
.commit-tag{font-family:'Kiwi Maru',serif;font-size:13px;color:var(--soil);letter-spacing:.1em;padding-top:6px;}
.commit-row h3{font-size:19px;margin:0 0 12px;color:var(--forest-deep);font-weight:600;}
.commit-row p{font-size:14px;color:#454f3f;max-width:640px;margin:0;}

/* products / cart */
.shop{background:var(--moss-deep);scroll-margin-top:90px;}
.shop-group{margin-bottom:64px;}
.shop-group:last-child{margin-bottom:0;}
.shop-group-title{
  font-family:'Kiwi Maru',serif;font-size:17px;color:var(--forest-deep);
  margin:0 0 24px;padding-bottom:10px;border-bottom:1px solid rgba(62,107,59,.2);
  display:flex;align-items:center;gap:10px;
}
.badge-new{
  background:var(--mango);color:var(--forest-deep);font-family:'Zen Maru Gothic',sans-serif;
  font-size:10px;font-weight:700;letter-spacing:.06em;padding:3px 8px;border-radius:2px;
}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.product-card{background:var(--paper);border:1px solid rgba(62,107,59,.14);border-radius:14px;overflow:hidden;padding:0 0 24px;}
.product-photo{
  aspect-ratio:4/3;
  background:linear-gradient(135deg, #DCE7C8, #B9D0A0);
  display:flex;align-items:center;justify-content:center;
  color:rgba(43,58,40,.4);font-size:12px;letter-spacing:.1em;
  margin-bottom:20px;
}
.product-card h3{font-size:16px;margin:0 20px 8px;font-weight:600;}
.product-card p.price{margin:0 20px 16px;font-size:14px;color:var(--soil);font-weight:700;}
.buy-btn{
  margin:0 20px;display:block;
  background:#65A055;color:#fff;
  border-radius:6px;
  padding:11px 0;text-align:center;
  text-decoration:none;font-size:13px;letter-spacing:.08em;
}
.shopify-note{margin-top:40px;font-size:12px;color:#5c6754;border:1px dashed rgba(62,107,59,.35);padding:16px 20px;}
.product-photo{overflow:hidden;}
.product-photo img{width:100%;height:100%;object-fit:cover;}
.product-commerce{margin:0 20px;}
.empty-shop{
  background:var(--paper);border:1px dashed rgba(62,107,59,.35);
  padding:40px 32px;font-size:13.5px;color:#5c6754;text-align:center;
  margin-top:24px;
}
.product-card-placeholder{opacity:.55;}

.shop-viewmore{text-align:center;margin-top:36px;}
.shop-viewmore a{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--forest-deep);font-size:14px;font-weight:700;
  letter-spacing:.06em;text-decoration:none;
  padding-bottom:2px;border-bottom:1px solid transparent;
  transition:border-color .2s ease,gap .2s ease;
}
.shop-viewmore a:hover{border-color:var(--forest-deep);gap:12px;}
.shop-viewmore a span{transition:transform .2s ease;}
.shop-viewmore a:hover span{transform:translateX(3px);}

/* news / announcements */
.news{background:var(--paper);scroll-margin-top:90px;}
.news-list{display:flex;flex-direction:column;}
.news-item{
  display:grid;grid-template-columns:130px 1fr;gap:24px;
  padding:26px 0;border-top:1px solid rgba(62,107,59,.16);align-items:baseline;
}
.news-item:last-child{border-bottom:1px solid rgba(62,107,59,.16);}
.news-date{font-size:12px;color:var(--soil);letter-spacing:.06em;}
.news-item h3{font-size:15px;font-weight:500;margin:0;}
.news-item a{text-decoration:none;color:var(--ink);}
.news-item a:hover{color:var(--forest-deep);}
.empty-news{padding:26px 0;font-size:13.5px;color:#8a9280;}

/* closing / cta */
.closing{background:linear-gradient(160deg, #FDF3DC 0%, var(--moss-deep) 100%);color:var(--forest-deep);text-align:center;scroll-margin-top:90px;}
.closing h2{font-size:clamp(22px,3vw,32px);font-weight:600;max-width:640px;margin:0 auto 20px;color:var(--forest-deep);}
.closing p{font-size:14px;color:#5c6754;max-width:480px;margin:0 auto 40px;}
.closing .cart-btn{display:inline-block;}

.contact-form{max-width:440px;margin:0 auto;display:flex;flex-direction:column;gap:14px;text-align:left;}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
  width:100%;padding:13px 16px;border-radius:8px;
  border:1px solid rgba(62,107,59,.25);background:#fff;
  font-family:inherit;font-size:14px;color:var(--ink);
  resize:vertical;
}
.contact-form input:focus,
.contact-form textarea:focus{outline:2px solid var(--forest);outline-offset:1px;}
.contact-form .cart-btn{
  border:none;cursor:pointer;font-family:inherit;
  align-self:center;margin-top:4px;
}
.contact-message{
  max-width:480px;margin:0 auto 24px;padding:14px 18px;
  border-radius:8px;font-size:13px;line-height:1.7;text-align:left;
}
.contact-message-success{background:rgba(92,138,82,.14);color:var(--forest-deep);border:1px solid rgba(92,138,82,.3);}
.contact-message-error{background:rgba(176,122,69,.12);color:var(--soil);border:1px solid rgba(176,122,69,.3);}
.contact-message a{color:inherit;text-decoration:underline;}

/* generic page content (page.php) */
.page-content{background:var(--paper);padding:100px 0 130px;}
.page-content .entry-content{max-width:720px;font-size:15px;color:#3a4535;}
.page-content .entry-content h2{color:var(--forest-deep);font-size:22px;margin-top:48px;}
.page-content .entry-content p{margin-bottom:22px;}

/* single product page (single-yn_product.php) */
.product-single{
  max-width:520px;margin:0 auto;
  background:var(--paper);border:1px solid rgba(62,107,59,.14);
  border-radius:14px;overflow:hidden;
}
.product-single-photo{aspect-ratio:4/3;overflow:hidden;}
.product-single-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.product-single-buy{padding:28px 24px 32px;}
.product-single-back{max-width:520px;margin:32px auto 0;text-align:center;}
.product-single-back a{color:var(--forest-deep);font-size:14px;text-decoration:none;}
.product-single-back a:hover{text-decoration:underline;}

.site-footer{background:var(--forest);color:rgba(255,255,255,.85);padding:36px 0;font-size:12px;border-top:3px solid var(--mango);}
.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.footer-inner a{color:#fff;text-decoration:none;}

@media (max-width:860px){
  .site-header nav{display:none;}
  .commit-row{grid-template-columns:1fr;}
  .product-grid{grid-template-columns:repeat(2,1fr);gap:14px;}
  .product-card{padding-bottom:14px;}
  .product-photo{aspect-ratio:1/1;margin-bottom:10px;font-size:10px;}
  .product-card h3{font-size:13px;margin:0 10px 6px;line-height:1.4;}
  .product-card p.price{margin:0 10px 10px;font-size:12px;}
  .buy-btn{margin:0 10px;padding:8px 0;font-size:11px;}
  .concept blockquote{padding-left:20px;}
}

@media (max-width:420px){
  .product-card h3{font-size:12px;}
}

/* scroll reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.22,.9,.32,1),transform .8s cubic-bezier(.22,.9,.32,1);}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.reveal-stagger > *{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;}
.reveal-stagger.is-visible > *{opacity:1;transform:translateY(0);}
.reveal-stagger.is-visible > *:nth-child(1){transition-delay:.05s;}
.reveal-stagger.is-visible > *:nth-child(2){transition-delay:.16s;}
.reveal-stagger.is-visible > *:nth-child(3){transition-delay:.27s;}
.reveal-stagger.is-visible > *:nth-child(4){transition-delay:.38s;}
.cart-btn{transition:transform .25s ease,box-shadow .25s ease;}
.cart-btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(221,160,46,.35);}
.product-card{transition:transform .3s ease,box-shadow .3s ease;}
.product-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(43,58,40,.12);}
@media (prefers-reduced-motion: reduce){
  .reveal,.reveal-stagger > *{opacity:1;transform:none;transition:none;}
}
