@import url("../assets/framework-base.css");
.showcase { padding: clamp(28px, 6vw, 68px); }
.showcase-number { display: block; color: var(--accent); font-size: 12px; font-weight: 900; letter-spacing: .18em; }
.showcase > strong { position: relative; z-index: 2; display: block; max-width: 800px; margin-top: 20px; font-size: clamp(48px, 8vw, 105px); line-height: .85; letter-spacing: -.07em; }
.showcase > p { position: relative; z-index: 2; max-width: 420px; margin-top: 25px; color: #b9bec5; line-height: 1.5; }
.showcase-art { position: absolute; pointer-events: none; }

:root { --bg:#f5f0e8; --paper:#fffaf2; --ink:#272520; --muted:#746d63; --line:#d2c7b9; --accent:#d85b38; --accent-2:#f3cf90; --dark:#272520; --width:1160px; }
.button,.nav-links .nav-cta{border-radius:999px}.hero-layout{grid-template-columns:.75fr 1.25fr}
.concept-stage{border:0;background:transparent;overflow:visible}.timeline-stage{position:relative;display:grid;min-height:500px;grid-template-columns:repeat(4,1fr);align-items:center}
.route{position:absolute;left:8%;right:8%;top:50%;height:4px;background:#272520}.route:after{content:"";position:absolute;right:-2px;top:-7px;border-left:18px solid #272520;border-top:9px solid transparent;border-bottom:9px solid transparent}
.timeline-stage article{position:relative;z-index:2;display:flex;min-height:250px;padding:18px;flex-direction:column;justify-content:space-between;background:#fffaf2;border:2px solid #272520;border-radius:120px 120px 8px 8px;text-align:center}
.timeline-stage article:nth-child(even){transform:translateY(100px);background:#f3cf90}.timeline-stage i{display:grid;width:52px;height:52px;margin:0 auto;place-items:center;color:#fff;background:#d85b38;border-radius:50%;font-style:normal;font-weight:900}.timeline-stage b{font-size:21px}.timeline-stage span{font-size:11px;line-height:1.45}
.feature-grid{gap:36px}.feature{position:relative;border:0;border-left:3px solid #d85b38}.feature:before{content:"";position:absolute;left:-9px;top:27px;width:15px;height:15px;background:#d85b38;border-radius:50%}
.about-mark{border-radius:140px 140px 8px 8px}.showcase{background:#f3cf90;color:#272520}.showcase>p{color:#746d63}.showcase-art{left:8%;right:8%;bottom:12%;height:4px;background:#272520}.showcase-art:after{content:"01       02       03       04";position:absolute;left:0;right:0;top:-38px;font-size:28px;font-weight:900;word-spacing:3vw}
@media(max-width:820px){.timeline-stage{grid-template-columns:1fr 1fr;gap:15px}.timeline-stage article:nth-child(even){transform:none}.route{display:none}}