
:root{--ink:#302319;--muted:#74675b;--gold:#ae7a2e;--cream:#faf7f2;--blue:#008fce}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Noto Sans JP","Yu Gothic",Meiryo,sans-serif;line-height:1.85;background:#fff}a{color:inherit}img{max-width:100%;display:block}.wrap{width:min(1120px,92%);margin:auto}
header{background:white;border-bottom:1px solid #eee;position:sticky;top:0;z-index:20}.head{width:min(1200px,94%);margin:auto;display:flex;align-items:center;justify-content:space-between;min-height:74px;gap:20px}.brand{text-decoration:none;display:flex;align-items:center;gap:12px;color:#123457}.mark{font-size:42px;color:var(--blue);line-height:1}.brand small,.brand em{display:block;font-size:10px;font-style:normal;line-height:1.5}.brand b{display:block;font-size:17px;line-height:1.25}.nav{display:flex;align-items:center;gap:18px;font-size:12px;font-weight:bold}.nav a{text-decoration:none;white-space:nowrap}.nav a:hover{color:var(--blue)}.contact{background:#039bd7;color:white!important;border-radius:50px;padding:11px 18px}.toggle{display:none;background:none;border:0;font-size:26px;color:#123457}
.hero img{width:100%;height:auto}.hero{background:#f7eadb}.intro{padding:70px 0 40px;text-align:center}.eyebrow{font-size:12px;letter-spacing:.22em;font-weight:800;color:var(--gold)}h1,h2,h3,p{margin-top:0}h2{font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(27px,3.4vw,40px);line-height:1.45}.lead{font-size:17px;color:#65564a;max-width:750px;margin:20px auto 0}.section{padding:72px 0}.cream{background:var(--cream)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}.photo{border-radius:16px;object-fit:cover;width:100%;max-height:410px}.overline{color:var(--gold);letter-spacing:.15em;font-size:12px;font-weight:bold}.bodycopy{font-size:15px;color:#574d43}.chips{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.chip{padding:8px 16px;background:#f3e8d5;border-radius:30px;font-size:13px}.section-title{text-align:center;margin-bottom:35px}.section-title p{color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:white;border-radius:14px;overflow:hidden;box-shadow:0 7px 24px #4c392110}.card img{width:100%;aspect-ratio:4/3;object-fit:cover}.card .copy{padding:20px}.card h3{font-size:18px;margin-bottom:7px}.card p{font-size:13px;color:var(--muted);margin:0}.feature{padding:24px;background:#f8f3e9;border-left:3px solid #c9a26a;border-radius:6px}.feature h3{font-size:17px}.feature p{margin:0;color:var(--muted);font-size:14px}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.table{width:100%;border-collapse:collapse;font-size:14px}.table th,.table td{border-bottom:1px solid #e4ddd3;padding:15px;text-align:left;vertical-align:top}.table th{width:25%;background:#f8f4ed}.disclaimer{font-size:12px;color:#796f63;margin-top:18px}.cta{background:#f2e7d6;text-align:center;padding:65px 0}.btn{display:inline-block;padding:13px 35px;background:#078ec9;color:white;border-radius:40px;text-decoration:none;font-weight:700;margin-top:15px}.back{display:inline-block;margin-top:15px;color:#165176}.footer{padding:25px;text-align:center;font-size:12px;color:#777}.small-label{font-size:12px;color:#a17941}
@media(max-width:900px){.toggle{display:block}.nav{display:none;position:absolute;left:0;right:0;top:74px;background:white;padding:22px 5%;box-shadow:0 12px 18px #0001;flex-direction:column;align-items:stretch;gap:20px}.nav.open{display:flex}.grid2{gap:25px}.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.head{min-height:68px}.brand b{font-size:14px}.brand small,.brand em{font-size:9px}.nav{top:68px}.section{padding:48px 0}.grid2{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr;gap:12px}.card .copy{padding:12px}.card h3{font-size:15px}.features{grid-template-columns:1fr}.hero img{min-height:230px;object-fit:cover;object-position:center}.intro{padding:48px 0 22px}.table th{width:32%}}

/* Mobile product proposal cards: readable two-column layout */
@media(max-width:600px){
 .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .card{min-width:0;border-radius:12px}
 .card img{aspect-ratio:4/3;object-fit:cover}
 .card .copy{padding:12px 11px 15px}
 .card h3{font-size:clamp(13px,3.6vw,16px);line-height:1.45;margin-bottom:6px;overflow-wrap:anywhere}
 .card p{font-size:clamp(11px,3vw,13px);line-height:1.65;overflow-wrap:anywhere}
 .section-title p{font-size:13px;line-height:1.7}
 .disclaimer{font-size:11px;line-height:1.7}
}

/* Match Shea Butter hero visual height on desktop. */
@media (min-width: 601px) {
  .hero { width:100%; aspect-ratio:2083 / 755; overflow:hidden; }
  .hero img { display:block; width:100%; height:100%; min-height:0; object-fit:cover; object-position:center center; }
}
@media (max-width:600px) {
  .hero { aspect-ratio:auto; }
  .hero img { display:block; width:100%; height:auto; min-height:0; object-fit:contain; }
}

/* Final hero override: never crop the text embedded in the banner. */
.hero { width:100% !important; height:auto !important; aspect-ratio:auto !important; overflow:visible !important; }
.hero > img { display:block !important; width:100% !important; height:auto !important; min-height:0 !important; max-height:none !important; aspect-ratio:auto !important; object-fit:contain !important; object-position:center center !important; }
