/* fc-hero.css — the forecast hero on the Store Mi product page (approved for production 29 Oct 2026).
   A website-only visual on Ponderosa Pine, not an app screen. Uses the v5.css variables; v5.css is unchanged. */
.fc{margin:clamp(44px,5.5vw,68px) 0 0;padding:0}
.fc__panel{border:1px solid var(--ln2);border-radius:24px;background:rgba(239,246,241,.035);padding:clamp(18px,2.6vw,36px)}
.fc__ask{display:flex;align-items:center;gap:16px;max-width:980px;padding:12px 12px 12px 28px;border-radius:36px;background:rgba(239,246,241,.07);border:1px solid var(--ln2);transition:border-color .3s var(--ease),background-color .3s var(--ease)}
.fc.is-asking .fc__ask{border-color:rgba(168,230,198,.62);background:rgba(239,246,241,.11)}
.fc__qs{flex:1;min-width:0;display:grid;font-size:clamp(19px,1.75vw,25px);font-weight:500;line-height:1.3;letter-spacing:-.02em;color:var(--tx)}
.fc__q{grid-area:1/1;align-self:center;transition:opacity .25s var(--ease)}
.fc__q.off{opacity:0}
.fc__un{visibility:hidden}
.fc__ty:after{content:"\2060";border-left:2px solid var(--ac);margin-left:1px;margin-right:-3px;visibility:hidden}
.fc__q.is-caret .fc__ty:after{visibility:visible;animation:fcBlink 1s steps(1) infinite}
.fc__send{flex:0 0 auto;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--ac);color:var(--on-ac);transition:transform .16s var(--ease),filter .16s}
.fc.is-send .fc__send{transform:scale(.86);filter:brightness(1.12)}
.fc__grid{display:grid;grid-template-columns:1fr 0fr;grid-template-rows:auto 1fr;grid-template-areas:"head side" "chart side";margin-top:30px;container-type:inline-size;transition:grid-template-columns .9s var(--ease),opacity .45s var(--ease)}
.fc.is-wait .fc__grid,.fc.is-wait .fc__foot{opacity:.28}
.fc.is-out .fc__grid,.fc.is-out .fc__foot{opacity:0}
.fc[data-s="1"] .fc__grid{grid-template-columns:1.12fr 1fr}
.fc__head{grid-area:head;min-width:0}
.fc__k{margin:0;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3);line-height:1.4}
.fc__bigrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-top:8px}
.fc__big{font-weight:500;font-size:clamp(40px,4.6vw,68px);line-height:1;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--tx)}
.fc__unit{font-family:var(--mono);font-size:13px;color:var(--tx3)}
.fc__tag{flex:0 0 auto;white-space:nowrap;align-self:center;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ac);border:1px solid rgba(168,230,198,.45);border-radius:999px;padding:4px 10px;opacity:0;transition:opacity .45s var(--ease)}
.fc.is-tag .fc__tag{opacity:1}
.fc__delta{margin:10px 0 0;font-size:15px;color:var(--ac)}
.fc__chart{grid-area:chart;min-width:0;display:flex;flex-direction:column;margin-top:20px}
.fc__legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--tx3)}
.fc__lg{display:inline-flex;align-items:center;gap:8px}
.fc__lg:before{content:"";width:18px;height:0;border-top:2px solid var(--tx3)}
.fc__lg--proj:before{border-top:3px solid var(--ac)}
.fc__lg--band:before{height:10px;border:0;border-radius:3px;background:rgba(168,230,198,.24)}
.fc__plot{position:relative;flex:1;min-height:200px;margin-top:12px}
.fc__pin{position:absolute;left:3%;right:3%;top:22px;bottom:28px}
.fc__pin svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fc__area{fill:rgba(239,246,241,.05)}
.fc__band{fill:rgba(168,230,198,.16)}
.fc__lh,.fc__lp{fill:none;stroke-linejoin:round;stroke-linecap:round}
.fc__lh{stroke:var(--tx3);stroke-width:2}
.fc__lp{stroke:var(--ac);stroke-width:3}
.fc__draw{position:absolute;inset:0}
.fc__dot{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:var(--ac);box-shadow:0 0 0 3px #17332B}
.fc__dot--now{background:var(--tx)}
.fc__gl{position:absolute;left:0;right:0;border-top:1px dashed var(--ln)}
.fc__gl span{position:absolute;left:0;bottom:3px;font-family:var(--mono);font-size:11px;color:var(--tx3)}
.fc__today{position:absolute;top:-22px;bottom:0;border-left:1px dashed var(--ln2)}
.fc__today span{position:absolute;top:0;left:8px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--tx2)}
.fc__peak{position:absolute;transform:translate(-50%,-160%);font-family:var(--mono);font-size:12px;color:var(--ac);white-space:nowrap;opacity:0;transition:opacity .45s var(--ease)}
.fc.is-peak .fc__peak{opacity:1}
.fc__mons{position:absolute;left:3%;right:3%;bottom:0;height:18px}
.fc__mons span{position:absolute;top:0;transform:translateX(-50%);font-family:var(--mono);font-size:11px;color:var(--tx3)}
.fc__mons span:nth-child(n+7){color:var(--tx2)}
.fc__note{margin:14px 0 0;font-size:13px;line-height:1.45;color:var(--tx3)}
.fc__side{grid-area:side;min-width:0;overflow:hidden}
.fc__sidein{width:calc(100cqw / 2.12);padding-left:clamp(28px,3.4vw,52px);border-left:1px solid var(--ln);opacity:0;transform:translateX(24px);transition:opacity .55s var(--ease),transform .7s var(--ease)}
.fc.is-side .fc__sidein{opacity:1;transform:none}
.fc__lead2{margin:10px 0 0;font-size:16px;line-height:1.45;color:var(--tx2);max-width:40ch}
.fc__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:22px}
.fc__n{display:block;font-weight:500;font-size:clamp(36px,3.6vw,52px);line-height:1;letter-spacing:-.04em;color:var(--ac);font-variant-numeric:tabular-nums}
.fc__nl{display:block;margin-top:6px;font-size:14px;color:var(--tx2)}
.fc__cal{margin-top:24px}
.fc__calh{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;align-items:center}
.fc__key{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--tx3)}
.fc__key i{width:10px;height:10px;border-radius:3px;background:var(--tx)}
.fc__key i.f{margin-left:8px;background:transparent;box-shadow:inset 0 0 0 1.5px var(--ac)}
.fc__months{display:grid;grid-template-columns:repeat(2,max-content);gap:8px 28px;margin-top:12px}
.fc__mo{display:flex;align-items:center;gap:10px}
.fc__ml{width:30px;font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--tx3)}
.fc__cells{display:flex;gap:5px}
.fc__cells i{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;font-style:normal;font-family:var(--mono);font-size:11px;background:var(--tx);color:var(--n1);transition:background .35s,color .35s,box-shadow .35s}
.fc__cells i.is-free{background:transparent;color:var(--ac);box-shadow:inset 0 0 0 1.5px var(--ac);animation:fcPop .45s var(--ease)}
.fc__profit{margin-top:24px}
.fc__pv{display:flex;align-items:baseline;gap:12px;margin-top:8px}
.fc__pn{font-weight:500;font-size:clamp(28px,2.6vw,36px);line-height:1;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.fc__pb,.fc__pc{color:#F2A48C;opacity:0;transition:opacity .4s var(--ease)}
.fc__pb{font-family:var(--mono);font-size:14px}
.fc.is-pr .fc__pb,.fc.is-pr .fc__pc{opacity:1}
.fc__bar{display:flex;height:10px;margin-top:12px;border-radius:5px;overflow:hidden;background:rgba(239,246,241,.08)}
.fc__bar i{display:block;width:100%;background:var(--tx2)}
.fc__bar b{display:block;width:0;background:#F2A48C}
.fc__pc{margin:8px 0 0;font-family:var(--mono);font-size:12.5px}
.fc__foot{display:flex;gap:16px;align-items:baseline;margin:28px 0 0;padding-top:20px;border-top:1px solid var(--ln);transition:opacity .45s var(--ease)}
.fc__who{flex:0 0 auto;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ac);opacity:0;transition:opacity .4s var(--ease)}
.fc.is-a1 .fc__who,.fc.is-sum .fc__who{opacity:1}
.fc__as{flex:1;min-width:0;display:grid;font-size:clamp(17px,1.5vw,22px);line-height:1.3;letter-spacing:-.02em;color:var(--tx)}
.fc__as>span{grid-area:1/1;opacity:0;transition:opacity .5s var(--ease)}
.fc.is-a1 .fc__a1,.fc.is-sum .fc__a2{opacity:1}
.fc__ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:4px 22px}
.fc__step{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0;border:0;background:none;color:var(--tx3);font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.fc__step:hover{color:var(--tx2)}
.fc__step[aria-pressed="true"]{color:var(--tx)}
.fc__step i{width:44px;height:2px;border-radius:2px;background:var(--ln2);overflow:hidden}
.fc__step b{display:block;height:100%;background:var(--ac);transform-origin:0 50%;transform:scaleX(0)}
@keyframes fcBlink{50%{opacity:0}}
@keyframes fcPop{0%{transform:scale(.8)}60%{transform:scale(1.08)}100%{transform:none}}
/* Stacked, when the figure is under 860px: the forecast and the scenario share one area and cross-fade, so the height never changes.
   One spacing rhythm (24px between blocks, 20px inside the scenario); the Sunday calendar becomes a single strip of 26. */
.fc.is-m .fc__panel{padding:20px;border-radius:22px}
.fc.is-m .fc__ask{align-items:center;gap:12px;max-width:none;padding:14px 12px 14px 18px;border-radius:22px}
.fc.is-m .fc__qs{font-size:18px;line-height:1.35}
.fc.is-m .fc__send{width:38px;height:38px}
.fc.is-m .fc__grid,.fc.is-m[data-s="1"] .fc__grid{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;grid-template-areas:"head" "stage";margin-top:24px}
.fc.is-m .fc__k{font-size:11px;letter-spacing:.04em}
.fc.is-m .fc__head{position:relative}
.fc.is-m .fc__big{font-size:40px}
.fc.is-m .fc__tag{position:absolute;left:0;bottom:0}
.fc.is-m .fc__delta{transition:opacity .45s var(--ease)}
.fc.is-m.is-tag .fc__delta{opacity:0}
.fc.is-m .fc__chart,.fc.is-m .fc__side{grid-area:stage;margin-top:24px}
.fc.is-m .fc__chart{transition:opacity .45s var(--ease)}
.fc.is-m.is-side .fc__chart{opacity:0}
.fc.is-m .fc__sidein{width:auto;padding:20px 0 0;border-left:0;border-top:1px solid var(--ln);transform:translateY(14px)}
.fc.is-m.is-side .fc__sidein{transform:none}
.fc.is-m .fc__lead2{margin-top:8px;font-size:15px}
.fc.is-m .fc__stats,.fc.is-m .fc__cal,.fc.is-m .fc__profit{margin-top:20px}
.fc.is-m .fc__n{font-size:34px}
.fc.is-m .fc__nl{font-size:13px}
.fc.is-m .fc__months{display:flex;gap:3px;margin-top:10px}
.fc.is-m .fc__mo,.fc.is-m .fc__cells{display:contents}
.fc.is-m .fc__ml{display:none}
.fc.is-m .fc__cells i{flex:1 1 0;min-width:0;width:auto;height:26px;border-radius:3px;font-size:0}
.fc.is-m .fc__mo+.fc__mo i:first-child{margin-left:4px}
.fc.is-m .fc__cells i.is-free,.fc.is-m .fc__key i.f{background:var(--ac);box-shadow:none}
.fc.is-m .fc__pn{font-size:26px}
.fc.is-m .fc__note{font-size:12.5px}
.fc.is-m .fc__foot{display:block;margin-top:24px;padding-top:16px}
.fc.is-m .fc__who{display:block;margin-bottom:6px}
.fc.is-m .fc__as{font-size:17px}
