:root {
  --bg:#f5efe7;
  --paper:#fffdf9;
  --ink:#241b16;
  --muted:#786a60;
  --brown:#2b2119;
  --brown2:#4a3427;
  --gold:#b99352;
  --gold2:#d0b079;
  --cream:#f1e7d8;
  --line:#e1d3c2;
  --danger:#b42318;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  color:var(--ink);
  background:linear-gradient(180deg,#fbf8f3 0%,var(--bg) 100%);
  line-height:1.75;
}
.hero {
  min-height:84vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:44px 18px 76px;
  text-align:center;
  color:#fff;
  background:
    linear-gradient(rgba(25,18,13,.80),rgba(25,18,13,.83)),
    url("https://images.unsplash.com/photo-1442512595331-e89e73853f31?auto=format&fit=crop&w=1600&q=85") center/cover;
}
.hero-inner { max-width:960px; }
.logo {
  width:min(210px,45vw);
  display:block;
  margin:0 auto 22px;
  background:#fff;
  border-radius:28px;
  padding:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.25);
}
.kicker {
  display:inline-block;
  border:1px solid rgba(255,255,255,.5);
  border-radius:999px;
  padding:7px 15px;
  font-size:13px;
  letter-spacing:.14em;
  margin-bottom:18px;
}
h1 {
  margin:0;
  font-size:clamp(32px,7vw,64px);
  line-height:1.18;
  letter-spacing:.01em;
}
.lead {
  margin:22px auto 0;
  max-width:800px;
  font-size:clamp(16px,3.9vw,20px);
}

.about-roastery {
  background:#2b2119;
  color:#fff;
  padding:72px 20px 92px;
}
.about-inner {
  max-width:980px;
  margin:0 auto;
  text-align:center;
}
.section-eyebrow {
  margin:0 0 16px;
  color:#c8a76d;
  font-size:13px;
  font-weight:900;
  letter-spacing:.18em;
}
.about-roastery h2 {
  margin:0;
  font-size:clamp(28px,5vw,45px);
  line-height:1.45;
  font-weight:800;
}
.about-text {
  max-width:820px;
  margin:34px auto 0;
  padding:0 24px;
  text-align:center;
  font-size:17px;
  line-height:2.05;
  color:#f4ede4;
}
.about-text p {
  margin:0 0 24px;
}
.about-points {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:42px;
}
.about-point {
  min-height:180px;
  padding:24px 20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  text-align:center;
}
.about-point strong {
  display:block;
  color:#d0b079;
  font-size:19px;
  margin-bottom:10px;
}
.about-point span {
  display:block;
  color:#f3ece3;
  line-height:1.8;
}
.mobile-break {
  display:none;
}

.container {
  max-width:1080px;
  margin:-44px auto 72px;
  padding:0 16px;
  position:relative;
  z-index:2;
}
.panel {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:26px;
  overflow:hidden;
  box-shadow:0 18px 60px rgba(40,25,10,.13);
}
.intro {
  padding:28px clamp(18px,5vw,44px);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  background:#faf3e9;
  border-bottom:1px solid var(--line);
}
.feature {
  border:1px solid var(--line);
  border-radius:18px;
  padding:17px;
  background:#fff;
}
.feature b { display:block; color:var(--brown); margin-bottom:4px; }
.step {
  padding:32px clamp(18px,5vw,46px);
  border-bottom:1px solid var(--line);
}
.step:last-child { border-bottom:0; }
.step-title {
  margin:0 0 9px;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--brown);
  font-size:23px;
  line-height:1.45;
}
.subtext {
  margin:0 0 18px 48px;
  color:var(--muted);
}
.num {
  width:38px;
  height:38px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--brown);
  color:#fff;
  font-weight:900;
  flex:none;
}
.choices {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.choice {
  display:flex;
  align-items:center;
  min-height:58px;
  border:1px solid #d8c8b4;
  background:#fffdf9;
  border-radius:16px;
  padding:14px 16px;
  cursor:pointer;
  font-weight:800;
  transition:.16s;
}
.choice:hover {
  transform:translateY(-1px);
  border-color:var(--gold);
  box-shadow:0 7px 18px rgba(82,54,31,.07);
}
.choice:has(input:checked) {
  border-color:var(--brown);
  background:#f3e8d9;
  box-shadow:0 0 0 2px rgba(43,33,25,.08);
}
.choice input {
  margin-right:10px;
  transform:scale(1.13);
  accent-color:var(--brown);
}
.cta-row {
  margin-top:24px;
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
}
.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:14px 24px;
  border-radius:999px;
  border:0;
  text-decoration:none;
  font-weight:900;
  font-size:16px;
  cursor:pointer;
  transition:.16s;
}
.btn:hover { transform:translateY(-1px); }
.btn-primary { background:#fff; color:var(--brown); }
.btn-dark { background:var(--brown); color:#fff; }
.btn-dark-outline { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.65); }
.btn-light { background:var(--cream); color:var(--brown); }
.btn-line { background:#06c755; color:#fff; }
.btn-gold { background:var(--gold); color:#fff; }
.result {
  display:none;
  margin-top:26px;
  border:2px solid var(--gold);
  border-radius:24px;
  background:linear-gradient(180deg,#fffdf9,#f4e9d9);
  padding:26px;
}
.result-label {
  display:inline-block;
  padding:5px 11px;
  border-radius:999px;
  background:var(--brown);
  color:#fff;
  font-size:13px;
  font-weight:900;
  margin-bottom:10px;
}
.result h2 {
  margin:0 0 10px;
  color:var(--brown);
  font-size:29px;
  line-height:1.35;
}
.result-grid {
  display:grid;
  gap:12px;
  margin:20px 0;
}
.result-grid-3 { grid-template-columns:repeat(3,1fr); }
.result-box {
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
}
.result-box small {
  display:block;
  color:var(--muted);
  font-weight:800;
}
.result-box strong {
  display:block;
  color:var(--brown);
  font-size:18px;
  margin-top:3px;
}
.proposal-box {
  background:var(--brown);
  color:#fff;
  border-radius:18px;
  padding:20px;
  margin-top:18px;
}
.proposal-box h3 { margin:0 0 8px; color:var(--gold2); }
.proposal-box p { margin:0; }
.reasons {
  margin:18px 0 0;
  padding:0;
  list-style:none;
}
.reasons li {
  margin:8px 0;
  padding-left:28px;
  position:relative;
}
.reasons li::before {
  content:"✓";
  position:absolute;
  left:0;
  color:var(--brown);
  font-weight:900;
}
.form-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
.field-full { grid-column:1/-1; }
label.field-label {
  display:block;
  font-weight:800;
  color:var(--brown);
  margin:0 0 6px;
}
input[type="text"],input[type="email"],input[type="tel"],input[type="date"],textarea,select {
  width:100%;
  border:1px solid #d8c8b4;
  border-radius:12px;
  padding:12px 13px;
  background:#fffdf8;
  font-size:15px;
}
textarea { min-height:105px; resize:vertical; }
.error {
  display:none;
  color:var(--danger);
  font-weight:900;
  margin-top:12px;
  text-align:center;
}
.note { color:var(--muted); font-size:13px; margin-top:12px; }
.status {
  display:none;
  margin-top:14px;
  padding:14px;
  border-radius:14px;
  background:#edf7ef;
  color:#143d2b;
  font-weight:800;
}
.admin { background:#faf3e9; }
.table-wrap { overflow-x:auto; margin-top:15px; }
table {
  width:100%;
  border-collapse:collapse;
  min-width:1160px;
  background:#fff;
}
th,td {
  border:1px solid var(--line);
  padding:9px;
  font-size:12px;
  text-align:left;
  vertical-align:top;
}
th { background:#eadbc8; color:var(--brown); }
td input, td select, td textarea { font-size:12px; padding:7px; min-width:120px; }
td textarea { min-height:62px; }
.save-row-btn {
  border:0;
  border-radius:9px;
  padding:8px 11px;
  background:var(--brown);
  color:#fff;
  font-weight:800;
  cursor:pointer;
}
.footer {
  text-align:center;
  padding:28px 16px 48px;
  color:var(--muted);
  font-size:13px;
}
@media(max-width:800px) {
  .intro,.choices,.result-grid-3,.form-grid { grid-template-columns:1fr; }
  
.about-roastery {
  background:#2b2119;
  color:#fff;
  padding:72px 20px 92px;
}
.about-inner {
  max-width:980px;
  margin:0 auto;
  text-align:center;
}
.section-eyebrow {
  margin:0 0 16px;
  color:#c8a76d;
  font-size:13px;
  font-weight:900;
  letter-spacing:.18em;
}
.about-roastery h2 {
  margin:0;
  font-size:clamp(28px,5vw,45px);
  line-height:1.45;
  font-weight:800;
}
.about-text {
  max-width:820px;
  margin:34px auto 0;
  padding:0 24px;
  text-align:center;
  font-size:17px;
  line-height:2.05;
  color:#f4ede4;
}
.about-text p {
  margin:0 0 24px;
}
.about-points {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:42px;
}
.about-point {
  min-height:180px;
  padding:24px 20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  text-align:center;
}
.about-point strong {
  display:block;
  color:#d0b079;
  font-size:19px;
  margin-bottom:10px;
}
.about-point span {
  display:block;
  color:#f3ece3;
  line-height:1.8;
}
.mobile-break {
  display:none;
}

.container { margin-top:-30px; }
  .btn { width:100%; }
  .step-title { font-size:20px; align-items:flex-start; }
  .subtext { margin-left:0; }
}

@media(max-width:800px) {
  .about-roastery {
    padding:56px 18px 70px;
  }
  .about-roastery h2 {
    font-size:27px;
    line-height:1.55;
  }
  .about-text {
    max-width:100%;
    padding:0;
    font-size:16px;
    line-height:1.95;
    text-align:center;
  }
  .about-points {
    grid-template-columns:1fr;
  }
  .about-point {
    min-height:0;
  }
  .mobile-break {
    display:block;
  }
}


.sample-banner{
max-width:1080px;
margin:-70px auto 30px;
padding:38px 32px;
background:linear-gradient(135deg,#3a2b20,#2b2119);
color:#fff;
border-radius:24px;
box-shadow:0 20px 60px rgba(0,0,0,.22);
text-align:center;
position:relative;
z-index:3;
}
.sample-badge{
display:inline-block;
padding:7px 18px;
border:1px solid #d0b079;
border-radius:999px;
color:#d0b079;
font-weight:800;
letter-spacing:.08em;
margin-bottom:18px;
font-size:13px;
}
.sample-banner h2{
margin:0;
font-size:clamp(30px,5vw,46px);
color:#fff;
}
.sample-banner p{
max-width:760px;
margin:22px auto;
font-size:18px;
line-height:1.9;
}
.sample-note{
display:inline-block;
background:#d0b079;
color:#2b2119;
padding:12px 22px;
border-radius:999px;
font-weight:800;
}
@media(max-width:800px){
.sample-banner{
margin:-40px 16px 24px;
padding:28px 20px;
}
.sample-banner p{
font-size:16px;
}
}


.sales-section {
  padding:64px clamp(18px,5vw,46px);
  border-bottom:1px solid var(--line);
}
.section-heading {
  max-width:760px;
  margin:0 auto 36px;
  text-align:center;
}
.section-heading h2 {
  margin:4px 0 14px;
  color:var(--brown);
  font-size:clamp(27px,5vw,40px);
  line-height:1.45;
}
.section-heading p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}
.dark-eyebrow {
  color:var(--gold);
}
.sales-card-grid,
.case-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.sales-card,
.case-card {
  position:relative;
  border:1px solid var(--line);
  border-radius:20px;
  padding:28px;
  background:#fff;
}
.sales-card {
  padding-top:54px;
}
.card-number {
  position:absolute;
  left:26px;
  top:20px;
  color:var(--gold);
  font-size:13px;
  font-weight:900;
  letter-spacing:.15em;
}
.sales-card h3,
.case-card h3 {
  margin:0 0 12px;
  color:var(--brown);
  font-size:21px;
  line-height:1.55;
}
.sales-card p,
.case-card p {
  margin:0;
  color:var(--muted);
  line-height:1.9;
}
.case-section {
  background:#faf3e9;
}
.case-type {
  margin-bottom:10px;
  color:var(--gold);
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
}
.result-cta {
  margin-top:28px;
  padding:30px 24px;
  border-radius:20px;
  background:var(--brown);
  color:#fff;
  text-align:center;
}
.result-cta-kicker {
  margin:0 0 8px;
  color:var(--gold2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
}
.result-cta h3 {
  margin:0;
  color:#fff;
  font-size:25px;
  line-height:1.5;
}
.result-cta-points {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin:18px 0;
}
.result-cta-points span {
  padding:7px 12px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  font-size:13px;
}
.sample-cta-button {
  background:var(--gold);
  color:#fff;
}
.pdf-document-header {
  display:none;
}
.sales-footer {
  background:#211812;
  color:#fff;
  padding:48px 20px 20px;
}
.footer-inner {
  max-width:960px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  text-align:left;
}
.footer-inner img {
  width:130px;
  padding:12px;
  border-radius:18px;
  background:#fff;
}
.footer-copy h2 {
  margin:0;
  color:#fff;
}
.footer-copy p {
  margin:5px 0;
}
.footer-services {
  color:#d8c9b9;
}
.footer-copy a {
  display:inline-block;
  margin-top:10px;
  color:var(--gold2);
  font-weight:900;
}
.copyright {
  max-width:960px;
  margin:34px auto 0;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.13);
  text-align:center;
  color:#ad9d90;
  font-size:12px;
}

@media(max-width:800px) {
  .sales-card-grid,
  .case-grid {
    grid-template-columns:1fr;
  }
  .sales-section {
    padding:48px 18px;
  }
  .footer-inner {
    flex-direction:column;
    text-align:center;
  }
}

@media print {
  @page {
    size:A4;
    margin:14mm;
  }
  body {
    background:#fff !important;
    color:#111 !important;
    font-family:"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  }
  body * {
    visibility:hidden !important;
  }
  #result,
  #result * {
    visibility:visible !important;
  }
  #result {
    display:block !important;
    position:absolute;
    left:0;
    top:0;
    width:100%;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:#fff !important;
    box-shadow:none !important;
  }
  .pdf-document-header {
    display:flex !important;
    align-items:center;
    gap:16px;
    margin-bottom:20px;
    padding-bottom:14px;
    border-bottom:2px solid #2b2119;
  }
  .pdf-document-header img {
    width:76px;
    padding:5px;
    border:1px solid #ddd;
    border-radius:10px;
  }
  .pdf-document-header p {
    margin:0;
    font-size:12px;
  }
  .pdf-document-header strong {
    display:block;
    margin-top:3px;
    font-size:20px;
  }
  .pdf-document-header span {
    display:block;
    margin-top:3px;
    color:#555;
    font-size:11px;
  }
  .result-label {
    background:#2b2119 !important;
    color:#fff !important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  .result-grid-3 {
    grid-template-columns:repeat(2,1fr) !important;
    gap:8px !important;
  }
  .result-box {
    padding:10px !important;
    break-inside:avoid;
  }
  .result-box strong {
    font-size:14px !important;
  }
  .proposal-box {
    background:#f1e7d8 !important;
    color:#111 !important;
    border:1px solid #d8c8b4 !important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
    break-inside:avoid;
  }
  .proposal-box h3 {
    color:#2b2119 !important;
  }
  .reasons,
  .result-cta {
    break-inside:avoid;
  }
  .result-cta {
    background:#f1e7d8 !important;
    color:#111 !important;
    border:1px solid #d8c8b4;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  .result-cta h3,
  .result-cta-kicker {
    color:#2b2119 !important;
  }
  .result-cta-points span {
    border-color:#b9aa99 !important;
  }
  .result .cta-row,
  .sample-cta-button {
    display:none !important;
  }
}


/* v12: PDF機能を分かりやすく表示 */
.pdf-hero-note { display:inline-block; margin-top:10px; color:#f1d59b; font-size:1.05em; }
.pdf-guide-section { background:#f5efe5; padding:72px 20px; }
.pdf-guide-inner { max-width:1080px; margin:0 auto; text-align:center; }
.pdf-guide-inner h2 { color:#2b2119; font-size:clamp(28px,4vw,44px); line-height:1.45; margin:12px 0 18px; }
.pdf-guide-lead { max-width:820px; margin:0 auto 34px; line-height:1.9; color:#54483e; }
.pdf-flow { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.pdf-flow > div { background:#fff; border:1px solid #dcc9ae; border-radius:18px; padding:28px 22px; box-shadow:0 8px 24px rgba(43,33,25,.08); }
.pdf-flow span { display:flex; width:42px; height:42px; border-radius:50%; align-items:center; justify-content:center; margin:0 auto 14px; background:#2b2119; color:#fff; font-weight:700; }
.pdf-flow strong { display:block; color:#2b2119; font-size:20px; margin-bottom:8px; }
.pdf-flow p { margin:0; color:#66584b; line-height:1.7; }
.pdf-main-button { box-shadow:0 0 0 4px rgba(188,142,66,.18); font-weight:700; }
@media (max-width:760px){ .pdf-flow{grid-template-columns:1fr;} .pdf-guide-section{padding:52px 18px;} }


/* Version 13: original blend diagnosis */
.blend-concept-section{margin-top:36px}
.blend-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}
.blend-benefits>div{padding:22px 18px;border:1px solid #dfd3c7;border-radius:16px;background:#fffdf9}
.blend-benefits strong{display:block;margin-bottom:7px;color:#2b2119;font-size:17px}
.blend-benefits span{display:block;color:#6f6258;font-size:14px;line-height:1.65}
.shop-name-step{border:2px solid #b89457;background:#fffaf1}
.shop-name-step input{width:100%;max-width:640px;padding:15px 16px;border:1px solid #cdbda9;border-radius:10px;font-size:16px;background:#fff}
.result .pdf-document-header p{letter-spacing:.06em}
@media(max-width:800px){.blend-benefits{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.blend-benefits{grid-template-columns:1fr}.shop-name-step input{font-size:16px}}