/* Natural-flow stories, progressively enhanced with short one-time reveals. */
.u-visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.circle-story { --circle-accent:220,79,78; position:relative; padding:56px 28px 72px; background:#fffdfa; }
.circle-story--gift { --circle-accent:228,189,37; background:#fffdf6; }
.circle-story__stage { position:relative; max-width:1040px; margin:auto; isolation:isolate; }
.circle-story__backdrop { position:absolute; top:0; left:50%; width:220px; aspect-ratio:1; transform:translateX(-50%); z-index:-1; pointer-events:none; }
.circle-story__ring { width:100%; height:100%; object-fit:contain; }
.circle-story__symbol { position:absolute; width:38%; height:38%; object-fit:contain; left:31%; top:31%; }
.circle-story__intro { padding-top:236px; text-align:center; max-width:760px; margin:0 auto 36px; }
.circle-story__name { margin:0 0 8px; font-size:clamp(23px,2.5vw,30px); font-weight:800; }
.circle-story__heading { margin:0 0 22px; font-size:clamp(20px,2.2vw,26px); line-height:1.5; }
.circle-story__copy { font-size:16px; line-height:1.95; text-align:center; text-wrap:pretty; line-break:strict; word-break:normal; }
.circle-story__cards-title { display:none; margin:0 0 18px; color:rgb(var(--circle-accent)); text-align:center; font-size:28px; line-height:1.4; }
.circle-story__copy p { margin:0 0 .7em; }
.circle-story__cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; list-style:none; padding:0; margin:0; }
.circle-story--gift .circle-story__cards { grid-template-columns:repeat(3,minmax(0,1fr)); }
.circle-story__cards li { padding:22px 24px 26px; background:rgba(255,255,255,.94); border:1px solid rgba(var(--circle-accent),.22); border-radius:24px; box-shadow:0 6px 22px rgba(75,55,30,.04); text-align:center; }
.circle-story__cards img { width:132px; height:124px; object-fit:contain; margin:0 auto 14px; }
.circle-story__cards h3 { margin:0 0 12px; font-size:21px; line-height:1.5; }
.circle-story__cards p { margin:0; font-size:15px; line-height:1.9; text-align:left; text-wrap:pretty; }
.circle-story__term { white-space:nowrap; }
.circle-story__trigger { display:none; }
.circle-story__snap { display:none; }
.world-show-section { position:relative; isolation:isolate; padding:96px 28px; background:#fff; overflow:clip; }
.world-show-section__content { max-width:1080px; margin:auto; }
.world-show-section h2 { margin:0 0 46px; text-align:center; font-size:clamp(27px,3vw,38px); line-height:1.5; }
.world-show-section__arrows { position:absolute; z-index:-1; width:min(64vw,600px); height:85%; object-fit:contain; top:8%; left:50%; transform:translateX(-50%); opacity:.09; pointer-events:none; }
.world-show-section ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; list-style:none; margin:0; padding:0; }
.world-show-section li { text-align:center; font-size:18px; font-weight:700; line-height:1.6; }
.world-show-section li img { width:100%; height:170px; object-fit:contain; margin:0 auto 18px; }
.world-show-section strong,.world-show-section small { display:block; }
.world-show-section small { font-size:12px; }
.circle-summary { padding:64px 10px 76px; background:#fff; overflow:clip; }
.circle-summary .circles-intro__visual { opacity:1; transform:none; margin-block:20px; }
.circle-summary .circle-card { opacity:1; transform:none; animation:none; }
.circle-summary .circles-intro__arrows { margin-bottom:0; opacity:1; transform:none; }
.circle-summary__meaning { text-align:center; font-size:27px; font-weight:800; line-height:1.5; margin:0; }
.circle-summary__meaning:first-of-type { color:var(--oc-red); }
.circle-summary__meaning:nth-of-type(2) { color:#8c7214; }
.circle-summary__message { max-width:720px; margin:30px auto 0; text-align:center; font-size:17px; line-height:1.9; text-wrap:pretty; }
@media (min-width:701px) and (prefers-reduced-motion:no-preference) {
  .circle-story.is-enhanced::after { content:""; display:block; height:30svh; }
  .circle-story.is-enhanced .circle-story__stage { position:sticky; top:var(--site-header-anchor-offset,84px); display:grid; min-height:calc(100svh - var(--site-header-anchor-offset,84px) - 28px); }
  .circle-story.is-enhanced .circle-story__intro,.circle-story.is-enhanced .circle-story__stage > .circle-story__cards,.circle-story.is-enhanced .circle-story__collection { grid-area:1 / 1; align-self:start; }
  .circle-story.is-enhanced .circle-story__collection { align-self:center; }
  .circle-story.is-enhanced .circle-story__cards-title { display:block; opacity:0; visibility:hidden; transition:opacity .25s ease; }
  .circle-story.is-revealed .circle-story__cards-title { opacity:1; visibility:visible; }
  .circle-story.is-enhanced .circle-story__intro { transition:opacity .2s ease,visibility .2s; }
  .circle-story.is-enhanced .circle-story__backdrop { transition:transform .6s ease,opacity .6s ease; transform-origin:50% 50%; }
  .circle-story.is-enhanced .circle-story__cards { visibility:hidden; }
  .circle-story.is-enhanced .circle-story__cards li { opacity:0; transform:translateY(14px) scale(.97); }
  .circle-story.is-enhanced .circle-story__trigger { display:block; position:absolute; bottom:calc(30svh + 72px); width:1px; height:1px; pointer-events:none; }
  .circle-story.is-enhanced .circle-story__snap { display:block; position:absolute; top:20svh; left:0; width:1px; height:1px; opacity:0; pointer-events:none; scroll-snap-align:start; scroll-snap-stop:always; }
  .circle-story.is-revealed .circle-story__intro { opacity:0; visibility:hidden; }
  .circle-story.is-revealed .circle-story__backdrop { opacity:.12; transform:translateX(-50%) translateY(140px) scale(2.8); }
  .circle-story--challenge.is-revealed .circle-story__backdrop { top:50%; transform:translate(-50%,-50%) scale(2.8); }
  .circle-story.is-revealed .circle-story__cards { visibility:visible; }
  .circle-story.is-revealed .circle-story__cards li { animation:circle-card-enter .26s cubic-bezier(.2,.7,.25,1) both; animation-delay:calc(var(--card-index) * .1s); }
  .circle-story.is-enhanced.has-revisited .circle-story__cards li { animation:none; opacity:1; transform:none; }
  .circle-story.is-enhanced.has-revisited .circle-story__backdrop { transition:none; }
  .circle-story.is-enhanced.has-revisited .circle-story__intro,
  .circle-story.is-enhanced.has-revisited .circle-story__cards-title { transition:none; }
  .circle-story.is-enhanced.is-reading-intro .circle-story__intro { opacity:1; visibility:visible; }
  .circle-story.is-enhanced.is-reading-intro .circle-story__cards,
  .circle-story.is-enhanced.is-reading-intro .circle-story__cards-title { opacity:0; visibility:hidden; }
  .circle-story.is-enhanced.is-reading-intro .circle-story__backdrop { top:0; opacity:1; transform:translateX(-50%); }
  .world-show-section.is-enhanced .world-show-section__content { opacity:0; transform:translateY(10px); transition:opacity .4s ease,transform .4s ease; }
  .world-show-section.is-revealed .world-show-section__content { opacity:1; transform:none; }
  .world-show-section__arrows { opacity:.055; animation:world-show-rotation 100s linear infinite; }
}
@keyframes world-show-rotation { to { transform:translateX(-50%) rotate(360deg); } }
@media (min-width:701px) {
  .circle-story--challenge .circle-story__cards { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
  .circle-story--challenge .circle-story__cards li { padding:18px 18px 20px; }
  .circle-story--challenge .circle-story__cards img { width:92px; height:84px; margin-bottom:8px; }
  .circle-story--challenge .circle-story__cards h3 { font-size:20px; margin-bottom:8px; }
  .circle-story--challenge .circle-story__cards p { font-size:14px; line-height:1.8; }
  .circle-story--gift .circle-story__cards { gap:18px; }
  .circle-story--gift .circle-story__cards li { padding:16px 22px 18px; }
  .circle-story--gift .circle-story__cards img { width:104px; height:90px; margin-bottom:10px; }
  .circle-story--gift .circle-story__cards h3 { font-size:20px; margin-bottom:8px; }
  .circle-story--gift .circle-story__cards p { font-size:14px; line-height:1.8; }
  .circle-story__cards p { line-break:strict; word-break:normal; }
}
@keyframes circle-card-enter { to { opacity:1; transform:none; } }
@media (max-width:1100px) {
  .world-show-section ol { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (min-width:701px) and (max-width:1000px) {
  .circle-story--challenge .circle-story__cards { gap:12px; }
  .circle-story--challenge .circle-story__cards li { padding-inline:14px; }
  .circle-story--challenge .circle-story__cards h3 { font-size:17px; }
}
@media (max-width:700px) {
  .circle-story { padding:42px 20px 48px; }
  .circle-story__backdrop { width:210px; }
  .circle-story__intro { padding-top:224px; }
  .circle-story__copy { font-size:14px; line-height:1.95; }
  .circle-story__cards,.circle-story--gift .circle-story__cards { grid-template-columns:1fr; gap:18px; }
  .circle-story__cards li { display:grid; grid-template-columns:minmax(80px,29%) minmax(0,1fr); grid-template-rows:auto auto; column-gap:16px; row-gap:8px; padding:22px 16px; text-align:left; }
  .circle-story__cards img { grid-column:1; grid-row:1 / 3; align-self:center; width:100%; height:116px; margin:0; }
  .circle-story__cards h3 { grid-column:2; align-self:end; margin:0; font-size:17px; line-height:1.5; word-break:normal; }
  .circle-story__cards p { grid-column:2; font-size:13px; line-height:1.85; line-break:strict; word-break:normal; }
  .world-show-section { padding:56px 20px; }
  .world-show-section__arrows { display:none; }
  .world-show-section h2 { font-size:26px; margin-bottom:28px; }
  .world-show-section ol { gap:24px 14px; }
  .world-show-section li { font-size:15px; }
  .world-show-section li img { height:130px; }
  .circle-summary { padding-top:42px; padding-bottom:52px; }
  .circle-summary__meaning { font-size:22px; }
  .circle-summary__message { padding:0 16px; font-size:15px; }
}