/* Layout measured from the saved Mobbin site Preview / Sections pages.
   Background and navigation continue to belong to the existing TOBIRA shell. */
@font-face{font-family:MobbinStudy;src:url('./saans-vf.woff2') format('woff2');font-weight:100 900;font-display:swap}
.mobbin-site{font-family:MobbinStudy,var(--tobira-font);padding-top:40px;max-width:1600px;margin:0 auto;color:#141414}
.website-heading{margin-bottom:48px}
.website-heading h1{font-size:48px;line-height:1;letter-spacing:-.035em;font-weight:600;margin:0 0 32px;overflow-wrap:anywhere;max-width:1100px}
.website-meta{display:flex;flex-wrap:wrap;gap:24px 32px;margin:0 0 28px}
.website-meta dt{font-size:14px;line-height:20px;color:#737373;margin-bottom:4px}
.website-meta dd{font-size:16px;line-height:24px;font-weight:500;margin:0}
.site-more{display:inline-block;position:relative;margin-left:4px}
.site-more summary{cursor:pointer;list-style:none}.site-more summary::-webkit-details-marker{display:none}
.site-more span{position:absolute;top:32px;left:0;z-index:5;min-width:200px;max-width:280px;background:#fff;border-radius:16px;padding:16px;box-shadow:0 8px 32px #0002;font-weight:400}
.website-actions{display:flex;gap:8px}.website-actions .action{font-size:16px;line-height:24px;min-height:44px;padding:10px 16px;transition:transform .15s ease,background .15s ease}.website-actions .action:active{transform:scale(.97)}
.website-tabs{display:flex;align-items:center;gap:24px;min-height:40px;margin:0 0 24px;font-size:16px;line-height:24px}
.website-version{margin-right:24px;font-weight:500}
.website-tabs a{position:relative;display:block;padding:6px 0;color:#777;font-weight:500}
.website-tabs a[aria-current]{color:#141414}.website-tabs a[aria-current]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:currentColor}
.website-section-count{margin-left:auto;text-align:right;font-size:12px;line-height:16px;color:#737373}
.website-preview{padding:120px 14%;border-radius:24px;background:#f5f5f580;overflow:hidden}
.website-preview img,.website-preview video{display:block;width:100%;height:auto;border-radius:16px}
.website-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}
.website-section{min-width:0;display:block}.website-section img,.website-section video{display:block;width:100%;height:auto;border-radius:8px}.website-section h2{font-size:16px;line-height:24px;font-weight:500;margin:12px 0 0}
.website-related{margin-top:80px}.website-related>h2{font-size:24px;line-height:32px;font-weight:600;margin:0 0 24px;letter-spacing:-.02em}
.website-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px}.website-related-grid>a{min-width:0}.website-related-grid h3{font-size:16px;line-height:24px;margin:12px 0 4px;font-weight:600}.website-related-grid p{font-size:14px;line-height:20px;color:#737373;margin:0;overflow-wrap:anywhere}
@media(max-width:1000px){.website-preview{padding:72px 8%}.website-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.mobbin-site{padding-top:24px}.website-heading{margin-bottom:32px}.website-heading h1{font-size:32px;line-height:1.1;margin-bottom:24px}.website-meta{gap:16px 24px}.website-tabs{gap:18px;flex-wrap:wrap}.website-version{margin-right:0}.website-preview{padding:24px 12px;border-radius:16px}.website-preview img,.website-preview video{border-radius:8px}.website-sections,.website-related-grid{grid-template-columns:1fr}.website-related{margin-top:48px}.website-section-count{flex-basis:100%;text-align:left}.site-more span{left:auto;right:0}}
@media(prefers-reduced-motion:reduce){.website-actions .action{transition:none}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.website-preview{background:#f5f5f5}.website-meta dt,.website-section-count,.website-related-grid p{color:#404040}}
/* Detail header (2026-10-01): a light description from the site's own words, then every tag as a link to the list
   narrowed to it (配色 with its swatch). */
.mobbin-site .website-about{max-width:760px;margin:-8px 0 24px;font-size:16px;line-height:1.75;color:#4d4d4d}
html[data-theme=dark] .mobbin-site .website-about{color:#b3b3b3}
.mobbin-site .website-meta dd{display:flex;flex-wrap:wrap;gap:2px 14px}
.mobbin-site .meta-pick{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;border-radius:4px;transition:opacity .15s}
.mobbin-site .meta-pick:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.mobbin-site .meta-pick:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.mobbin-site .meta-pick .color-label-dot{display:inline-block;flex:none;width:12px;height:12px;margin:0;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.16)}
/* 公開 / このバージョン: the date, and under it where it comes from. */
.mobbin-site .website-meta dd:has(.meta-note){flex-direction:column;gap:0}
.mobbin-site .meta-note{display:block;font-size:12px;line-height:18px;font-weight:400;letter-spacing:0;color:#8a8a8a}
html[data-theme=dark] .mobbin-site .meta-note{color:#8f8f8f}
/* 会社について / このサイトが表現していること (catalog company, siteNotes; first for お酒・ワイナリー, 2026-10-02).
   A tinted surface, no outline (AGENTS.md: a surface that reads by its own fill gets no decorative border). */
.site-company{margin:-24px 0 40px;padding:24px 28px;border-radius:16px;background:#f5f5f4}
.site-company h2{margin:0 0 16px;font-size:13px;line-height:18px;font-weight:600;letter-spacing:.04em;color:#737373}
.site-facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px 32px;margin:0}
.site-fact dt{margin:0 0 4px;font-size:13px;line-height:18px;color:#737373}
.site-fact dd{display:flex;flex-direction:column;gap:2px;margin:0}
.site-fact dd>span{font-size:15px;line-height:22px;font-weight:600}
.site-fact dd>small{font-size:12px;line-height:17px;color:#8a8a8a}
.site-notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px 32px;margin-top:24px}
.site-notes h3{margin:0 0 6px;font-size:13px;line-height:18px;font-weight:600;color:#737373}
.site-notes p{margin:0;font-size:14px;line-height:1.75}
.site-sources{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin:20px 0 0;font-size:12px;line-height:18px;color:#737373}
.site-sources>span:first-child{font-weight:600;margin-right:4px}
.site-sources a{color:inherit;text-decoration:underline;text-underline-offset:2px}
html[data-theme=dark] .site-company{background:#1c1c1c}
html[data-theme=dark] .site-fact dd>span,html[data-theme=dark] .site-notes p{color:#ededed}
@media(max-width:760px){.site-company{margin-top:-16px;padding:20px}.site-facts,.site-notes{grid-template-columns:minmax(0,1fr)}}