.blog-post-detail{background:radial-gradient(circle at top left, #c8a15a24, transparent 34rem), var(--color-bg,#f8f4ef)}.blog-post-detail__hero{background:var(--color-bg-soft,#fbf8f4);border-bottom:1px solid var(--color-border,#4c362d29);padding-top:clamp(3rem,6vw,5rem)}.blog-post-detail__back{color:var(--color-primary,#8b6a3a);font-size:var(--text-xs,.78rem);letter-spacing:.12em;text-transform:uppercase;margin-bottom:1.5rem;font-weight:800;display:inline-flex}.blog-post-detail__hero h1{max-width:900px;color:var(--color-primary-dark,#4c362d);font-family:var(--font-heading,Georgia, serif);margin:0;font-size:clamp(2.5rem,5vw,5.2rem);font-weight:500;line-height:.98}.blog-post-detail__description{max-width:760px;color:var(--color-text-soft,#6f625b);margin-top:1.25rem;font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.75}.blog-post-detail__meta{color:var(--color-text-muted,#93867d);letter-spacing:.08em;text-transform:uppercase;flex-wrap:wrap;gap:.75rem 1.25rem;margin-top:1.5rem;font-size:.78rem;font-weight:700;display:flex}.blog-post-detail__tags{flex-wrap:wrap;gap:.55rem;margin-top:1.35rem;padding:0;display:flex}.blog-post-detail__tags li{border:1px solid var(--color-border,#4c362d29);color:var(--color-primary-dark,#4c362d);letter-spacing:.08em;text-transform:uppercase;background:#ffffff94;border-radius:999px;padding:.35rem .75rem;font-size:.72rem;font-weight:700;list-style:none}.blog-post-detail__cover{width:min(100% - 2rem,1180px);margin:clamp(2rem,4vw,3rem) auto 0;transform:translateY(3rem)}.blog-post-detail__cover img{object-fit:cover;border-radius:var(--radius-lg,1.75rem);width:100%;max-height:560px;box-shadow:var(--shadow-lg,0 30px 80px #2b252238)}.blog-post-detail__body{width:min(100% - 2rem,820px);color:var(--color-text,#2b2522);margin-inline:auto;padding-top:clamp(5rem,8vw,7rem);padding-bottom:clamp(4rem,7vw,7rem);font-size:clamp(1rem,1vw,1.08rem);line-height:1.85}.blog-post-detail__body>*+*{margin-top:1.35rem}.blog-post-detail__body h2,.blog-post-detail__body h3,.blog-post-detail__body h4{color:var(--color-primary-dark,#4c362d);font-family:var(--font-heading,Georgia, serif);font-weight:600;line-height:1.08}.blog-post-detail__body h2{margin-top:3rem;font-size:clamp(2rem,3vw,3.2rem)}.blog-post-detail__body h3{margin-top:2.25rem;font-size:clamp(1.5rem,2vw,2.2rem)}.blog-post-detail__body p{margin:0}.blog-post-detail__body a{color:var(--color-primary,#8b6a3a);text-underline-offset:.2em;font-weight:700;text-decoration:underline}.blog-post-detail__body ul,.blog-post-detail__body ol{padding-left:1.3rem}.blog-post-detail__body li+li{margin-top:.55rem}.blog-post-detail__body blockquote{border-left:4px solid var(--color-accent,#c8a15a);background:var(--color-bg-soft,#fbf8f4);color:var(--color-primary-dark,#4c362d);font-family:var(--font-heading,Georgia, serif);border-radius:0 1rem 1rem 0;margin:2rem 0;padding:1.5rem 1.75rem;font-size:clamp(1.35rem,2vw,2rem);line-height:1.35}.blog-post-detail__body img,.blog-post-detail__body video,.blog-post-detail__body iframe{border:0;border-radius:1.1rem;max-width:100%}.blog-post-detail__body iframe{aspect-ratio:16/9;width:100%}.blog-media{margin:2.25rem 0}.blog-media img,.blog-media video{width:100%;box-shadow:var(--shadow-md,0 18px 46px #2b252224)}.blog-media figcaption,.blog-video figcaption{color:var(--color-text-muted,#93867d);text-align:center;margin-top:.75rem;font-size:.82rem;line-height:1.55}.blog-media--wide{width:min(100vw - 2rem,1080px);margin-left:50%;transform:translate(-50%)}.blog-media--left,.blog-media--right{width:min(48%,360px);margin-top:.4rem;margin-bottom:1rem}.blog-media--left{float:left;margin-right:1.5rem}.blog-media--right{float:right;margin-left:1.5rem}.blog-media--portrait{max-width:520px;margin-inline:auto}.blog-video{border:1px solid var(--color-border,#4c362d29);background:var(--color-surface,#fff);box-shadow:var(--shadow-sm,0 8px 24px #2b252214);border-radius:1.4rem;margin:2.5rem 0;padding:clamp(1rem,2vw,1.5rem)}.blog-video video,.blog-video iframe{aspect-ratio:16/9;background:#000;border-radius:1rem;width:100%}.blog-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;width:min(100vw - 2rem,1080px);margin:2.5rem 0 2.5rem 50%;display:grid;transform:translate(-50%)}.blog-gallery figure{margin:0}.blog-gallery img{aspect-ratio:4/3;object-fit:cover;width:100%;height:100%;box-shadow:var(--shadow-sm,0 8px 24px #2b252214);border-radius:1rem}.blog-callout{border:1px solid var(--color-border,#4c362d29);background:linear-gradient(135deg, #c8a15a24, transparent), var(--color-bg-soft,#fbf8f4);border-radius:1.1rem;margin:2rem 0;padding:1.5rem}.blog-post-detail__body:after{content:"";clear:both;display:block}@media (width<=720px){.blog-media--left,.blog-media--right{float:none;width:100%;margin-inline:0}.blog-gallery{grid-template-columns:1fr}.blog-post-detail__cover{transform:translateY(2rem)}.blog-post-detail__body{padding-top:4rem}}.blog-toc{margin-inline:auto;background:var(--color-bg-soft,#fbf8f4);border:1px solid var(--color-border,#4c362d29);border-radius:12px;width:min(100% - 2rem,820px);margin-top:clamp(3rem,5vw,4.5rem);padding:1.5rem 1.75rem}.blog-toc+.blog-post-detail__body{padding-top:clamp(2.5rem,4vw,3.5rem)}@media (width>=1024px){.blog-post-detail__layout:has(.blog-toc){grid-template-columns:260px minmax(0,820px);justify-content:center;align-items:start;column-gap:clamp(2rem,4vw,3.5rem);width:min(100% - 2rem,1180px);margin-inline:auto;display:grid}.blog-post-detail__layout:has(.blog-toc) .blog-toc{margin-inline:0;width:auto;max-height:calc(100vh - 7rem);margin-top:clamp(5rem,8vw,7rem);position:sticky;top:5.5rem;overflow:auto}.blog-post-detail__layout:has(.blog-toc) .blog-post-detail__body{width:100%;padding-top:clamp(5rem,8vw,7rem)}}.blog-toc__title{color:var(--color-primary-dark,#4c362d);font-size:var(--text-xs,.78rem);letter-spacing:.12em;text-transform:uppercase;margin:0 0 .75rem;font-weight:800}.blog-toc__list{margin:0;padding:0;list-style:none}.blog-toc__item{line-height:1.9}.blog-toc__item[data-depth="1"]{padding-left:1.25rem}.blog-toc__item[data-depth="2"]{padding-left:2.5rem}.blog-toc__item a{color:var(--color-primary,#8b6a3a);text-decoration:none}.blog-toc__item a:hover{text-decoration:underline}
