/* OKURI BASE — column pages + photo sections */
.col-page main{padding:28px 0 72px}
.wrap.narrow{max-width:820px}
.crumbs{font-size:12.5px;color:var(--muted);margin:4px 0 22px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crumbs a{color:var(--green-d)}
.crumbs b{font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.eyebrow{display:inline-block;background:var(--green-l);color:var(--green-d);font-weight:700;font-size:12px;padding:4px 12px;border-radius:999px;letter-spacing:.08em}

/* list */
.col-hero{text-align:center;margin:8px 0 26px}
.col-hero h1{font-size:clamp(26px,4vw,40px);margin:12px 0 10px}
.col-hero p{color:var(--muted);max-width:640px;margin:0 auto}
.cfilters{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:0 0 28px}
.cfilters a{background:#fff;border:1px solid var(--line);padding:7px 16px;border-radius:999px;font-size:14px;font-weight:700;color:var(--muted)}
.cfilters a.on,.cfilters a:hover{background:var(--green);border-color:var(--green);color:#fff}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.cgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cgrid{grid-template-columns:1fr}}
.ccard{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s}
.ccard:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(31,42,42,.12)}
.ccard .thumb{aspect-ratio:16/10;background:var(--green-l);overflow:hidden}
.ccard .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.ccard:hover .thumb img{transform:scale(1.04)}
.ccard .noimg{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,var(--green-l),#fff3d6);font-size:46px}
.ccard .cbody{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.ccard h3{font-size:16.5px;line-height:1.55;margin:0;flex:1}
.ccard time{font-size:12.5px;color:var(--muted)}
.meta{display:flex;flex-wrap:wrap;gap:6px}
.meta span,.meta a{font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:999px;line-height:1.5}
.meta .cat{background:var(--green);color:#fff}
.meta .ctry{background:#fff3d6;color:#8a5a00}
.meta .fld{background:#ffe9e0;color:#b4482a}
.empty{text-align:center;color:var(--muted);grid-column:1/-1;padding:40px 0}
.pager{display:flex;justify-content:space-between;margin:30px 0 0}
.pager a{font-weight:700;color:var(--green-d)}
.ctry-chips{margin:44px 0 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ctry-chips b{width:100%;font-size:15px;margin-bottom:4px}
.ctry-chips a{background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 13px;font-size:13.5px}
.ctry-chips a:hover{border-color:var(--green);color:var(--green-d)}

/* article */
.col-article h1{font-size:clamp(24px,3.6vw,34px);line-height:1.45;margin:14px 0 10px}
.dates{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--muted);margin-bottom:20px}
.ahero{margin:0 0 24px;border-radius:20px;overflow:hidden;position:relative;box-shadow:var(--shadow)}
.ahero img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.ahero figcaption{position:absolute;right:10px;bottom:8px;font-size:10.5px;color:#fff;background:rgba(0,0,0,.38);padding:2px 8px;border-radius:6px}
.alead{font-size:17px;line-height:1.9;background:#fff;border-left:5px solid var(--green);padding:18px 20px;border-radius:0 14px 14px 0;margin:0 0 24px}
.toc{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px 22px;margin:0 0 30px}
.toc b{display:block;margin-bottom:6px}
.toc ol{margin:0;padding-left:1.3em}
.toc li{margin:4px 0;font-size:15px}
.toc a{color:var(--green-d)}
.abody{font-size:16.5px;line-height:1.95}
.abody h2{font-size:clamp(20px,2.8vw,25px);margin:48px 0 16px;padding:12px 16px;background:var(--green-l);border-radius:12px;border-left:6px solid var(--green);scroll-margin-top:84px}
.abody h3{font-size:19px;margin:30px 0 10px;padding-bottom:6px;border-bottom:2px dotted var(--peach)}
.abody p{margin:0 0 1.2em}
.abody ul,.abody ol{padding-left:1.4em;margin:0 0 1.3em}
.abody li{margin:.3em 0}
.abody a{color:var(--green-d);text-decoration:underline;text-underline-offset:3px}
.abody strong,.abody b{background:linear-gradient(transparent 64%,#ffe98a 64%)}
.abody table{width:100%;border-collapse:collapse;background:#fff;font-size:14.5px;margin:0 0 1.4em;display:block;overflow-x:auto}
.abody th,.abody td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.abody th{background:var(--green-l);color:var(--green-d);white-space:nowrap}
.abody blockquote{margin:0 0 1.3em;padding:14px 18px;background:#fff;border-left:4px solid var(--line);color:var(--muted)}
.abody .point,.abody .note,.abody .warn,.abody .check,.abody .box,.abody .summary{background:#fff;border-radius:16px;padding:18px 20px 6px;margin:0 0 1.5em;border:2px solid var(--green-l);position:relative}
.abody .point:before,.abody .warn:before,.abody .summary:before,.abody .check:before{display:inline-block;font-weight:800;font-size:13px;padding:2px 12px;border-radius:999px;margin-bottom:8px}
.abody .point:before{content:"POINT";background:var(--yellow)}
.abody .summary{border-color:var(--yellow)}
.abody .summary:before{content:"まとめ";background:var(--yellow)}
.abody .check:before{content:"チェック";background:var(--green);color:#fff}
.abody .warn{border-color:#ffd6c8}
.abody .warn:before{content:"注意";background:var(--coral);color:#fff}
.inph{margin:6px 0 1.6em}
.inph img{width:100%;height:auto;border-radius:16px;aspect-ratio:16/10;object-fit:cover}
.inph figcaption{font-size:13px;color:var(--muted);margin-top:6px;display:flex;justify-content:space-between;gap:10px}
.inph figcaption small{font-size:10.5px;white-space:nowrap}
.col-cta{margin:44px 0;background:var(--yellow);border-radius:24px;padding:30px 26px;position:relative;overflow:hidden}
.col-cta:after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.35)}
.col-cta h2{font-size:clamp(20px,2.8vw,26px);margin:10px 0 8px;position:relative;z-index:1}
.col-cta p{margin:0 0 16px;font-size:15px;position:relative;z-index:1}
.col-cta .eyebrow{background:#fff;color:var(--green-d)}
.col-cta .ctas{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}
.afaq,.asrc{margin:40px 0}
.afaq h2,.asrc h2{font-size:22px}
.afaq details{background:#fff;border-radius:14px;margin:0 0 10px;box-shadow:0 4px 14px rgba(31,42,42,.05)}
.afaq summary{cursor:pointer;padding:16px 18px;font-weight:700;list-style:none;position:relative;padding-left:46px}
.afaq summary::-webkit-details-marker{display:none}
.afaq summary:before{content:"Q";position:absolute;left:16px;top:14px;width:22px;height:22px;border-radius:50%;background:var(--green);color:#fff;font-size:12px;display:grid;place-items:center}
.afaq details>div{padding:0 18px 16px 46px;color:var(--muted);font-size:15px}
.asrc ul{padding-left:1.2em;font-size:14px}
.asrc a{color:var(--green-d);text-decoration:underline;word-break:break-all}
.asrc .disc{font-size:12.5px;color:var(--muted);margin-top:10px}
.author{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 20px;font-size:13.5px;color:var(--muted)}
.author b{color:var(--ink);font-size:15px}
.arel{margin:56px 0 0}
.arel h2{font-size:22px;margin-bottom:18px}
.arel .cgrid{grid-template-columns:repeat(3,1fr)}
@media(max-width:760px){.arel .cgrid{grid-template-columns:1fr}}

/* top page: real photos + latest column */
.photo-sec{padding:20px 0 56px}
.photo-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:210px 210px;gap:14px}
.photo-grid figure{margin:0;border-radius:20px;overflow:hidden;position:relative;background:var(--green-l)}
.photo-grid figure:first-child{grid-row:1/3}
.photo-grid img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.photo-grid figure:hover img{transform:scale(1.05)}
.photo-grid figcaption{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,.92);font-weight:800;font-size:13px;padding:5px 12px;border-radius:999px}
.photo-grid .tx{background:var(--green);color:#fff;border-radius:20px;padding:20px 22px;display:flex;flex-direction:column;justify-content:center}
.photo-grid .tx h2{color:#fff;font-size:clamp(18px,1.9vw,21px);margin-bottom:8px}
.photo-grid .tx p{margin:0;opacity:.92;font-size:13.5px;line-height:1.7}
@media(max-width:860px){.photo-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}.photo-grid figure{height:150px}.photo-grid figure:first-child{grid-row:auto;grid-column:1/3;height:220px}.photo-grid .tx{grid-column:1/3}}
.latest-col .cgrid{margin-top:8px}
.latest-col .more{text-align:center;margin-top:26px}

/* thumbs fill */
.ccard .thumb{position:relative}
.ccard .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}