/* BenchCadence / PRODUCT STORY SYSTEM 2026 */
:root{--ink:#182526;--muted:#657476;--line:#e7ebe9;--teal:#23564a;--wash:#f8f9f7;--slate:#eef3f0;--card:#fff;--radius:18px}
html{scroll-behavior:smooth}body{background:#f8f9f7;color:#182526;font-family:Inter,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;letter-spacing:-.015em}
h1,h2,h3{font-weight:640;letter-spacing:-.052em}h1{font-size:clamp(3.1rem,7vw,6.2rem);line-height:1.07}h2{font-size:clamp(2.2rem,4vw,3.6rem)}
.mast{position:sticky;top:0;z-index:100;background:rgba(250,251,250,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid #e3e9e6}
.mast .wrap{min-height:74px;max-width:1360px}.logo{font-weight:750;letter-spacing:-.055em;font-size:1.32rem}.mark{background:#dcebe3;color:#234d3e;font-weight:700;width:37px;height:37px;border-radius:10px;letter-spacing:-.08em}.topnav{gap:24px}.topnav a{font-size:.86rem;font-weight:570;color:#334e49}.topnav .language{background:transparent;border:1px solid #dbe6df;border-radius:99px;padding:6px 12px}.topnav .nav-cta{background:#1b3430;color:#fff;border-radius:99px;padding:9px 16px}
.wrap{max-width:1160px}.eyebrow{color:#4f7869;font-size:.72rem;letter-spacing:.19em;font-weight:730}
.product-hero{position:relative;overflow:hidden;padding:75px 0 0;background:radial-gradient(ellipse 72% 72% at 90% 12%,#e3ebe3 0%,transparent 80%),linear-gradient(125deg,#fcfdfb,#f2f6f1 68%,#edf0ed)}
.product-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,#71867c0a 1px,transparent 1px);background-size:72px 72px;pointer-events:none}
.product-hero .wrap{position:relative;max-width:1260px}
.product-hero .hero-copy{max-width:860px;text-align:center;margin:0 auto 52px}
.product-hero h1{margin:24px auto;max-width:980px}
.product-hero .accent{color:#567d69}
.product-hero .lede{font-size:clamp(1rem,1.8vw,1.24rem);color:#687972;max-width:650px;margin:0 auto;line-height:1.9}
.product-hero .buttons{justify-content:center;margin:30px 0 17px}.button{background:#1c3832;border-radius:99px;min-height:51px;padding:12px 24px;font-weight:630;color:white;box-shadow:none;transition:transform .2s,box-shadow .2s,background .2s}
.button:hover{transform:translateY(-2px);box-shadow:0 10px 25px #132d2620;background:#2a5045}.button.outline{background:#fff;color:#1c3933;border:1px solid #cadad0}
.product-hero .fine{text-align:center;max-width:740px;margin:15px auto;color:#89938e}
.hero-visual{position:relative;max-width:1130px;margin:0 auto;padding:0 26px 0}
.preview-shell{position:relative;border:1px solid #e1e8e3;border-bottom:0;background:#fff;border-radius:18px 18px 0 0;box-shadow:0 16px 75px #1c34242b;overflow:hidden;transform:perspective(1600px) rotateX(1.8deg);transform-origin:center bottom}
.preview-top{height:49px;display:flex;align-items:center;justify-content:space-between;padding:0 19px;border-bottom:1px solid #e5ebe8;color:#667b71;font-size:11px}
.preview-brand{font-weight:780;color:#1b3730;font-size:14px}.preview-dots{display:flex;gap:6px}.preview-dots i{width:7px;height:7px;border-radius:50%;background:#d4ddd7}
.preview-body{display:grid;grid-template-columns:175px minmax(0,1fr);min-height:370px}
.preview-sidebar{background:#f7f9f6;padding:26px 16px;border-right:1px solid #e8ede9;display:flex;flex-direction:column;gap:13px;color:#74857a;font-size:12px}
.preview-sidebar strong{color:#2e5446;background:#e2eee6;padding:10px;border-radius:8px}
.preview-main{padding:26px 27px;background:#fff;min-width:0}
.preview-mainheader{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.preview-mainheader strong{font-size:22px;font-weight:650;letter-spacing:-.05em}.preview-mainheader span{font-size:11px;background:#edf3ef;border-radius:99px;padding:8px 12px;color:#527063}
.preview-weekdays,.preview-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.preview-weekdays span{text-align:center;font-size:10px;color:#9aa6a1;padding:9px 0;background:#fafbfa;border-top:1px solid #e9eeeb;border-bottom:1px solid #e9eeeb}
.preview-day{min-height:82px;border-bottom:1px solid #eef1ee;border-right:1px solid #eef1ee;padding:6px 7px;color:#a2b0a8;font-size:10px}.preview-day strong{display:block;font-weight:530;color:#596c61}.preview-day.today{background:#f1f7f0}
.preview-event{display:block;margin-top:5px;padding:5px 3px;border-radius:5px;background:#e0eee4;color:#427461;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px}.preview-event.lav{background:#ebe7f5;color:#80689a}.preview-event.amber{background:#f7eddc;color:#9c7853}
.preview-hint{position:absolute;right:-6px;top:60px;background:rgba(255,255,255,.96);border:1px solid #e2e9e4;border-radius:13px;padding:16px 19px;box-shadow:0 15px 40px #213a2519;transform:rotate(3deg);font-size:13px;max-width:235px;color:#375a4a}.preview-hint b{display:block;margin-bottom:5px;color:#22382e}
.section{padding:86px 0}.section.alt{background:#fff}
.section .section-heading{text-align:center;max-width:760px;margin:0 auto 35px}.section-heading p{font-size:1.08rem;color:#73817c}
.cards{gap:17px}.card{box-shadow:none;background:#fff;border:1px solid #e9ece9;padding:29px;border-radius:18px;transition:transform .2s ease,border .2s ease}.card:hover{transform:translateY(-3px);border-color:#b6cbc1}
.photo-block{overflow:hidden;border-radius:21px;position:relative;background:#21352d;min-height:420px;display:flex;align-items:end}
.photo-block:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 28%,#102722dc)}
.photo-block img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo-block .photo-copy{position:relative;z-index:1;color:white;padding:35px;max-width:550px}
.photo-copy h2,.photo-copy p{color:white}
.photo-copy p{opacity:.89}
.photo-credit{position:absolute;right:16px;bottom:10px;color:#ffffffbd;font-size:10px;z-index:2}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.story-panel{border-radius:20px;background:#e7efe7;padding:36px;min-height:270px;overflow:hidden}.story-panel.dark{background:#213d37;color:white}.story-panel.dark p{color:#c6d9ce}
.process-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:24px 0}
.process-step{border-radius:12px;background:white;padding:15px 11px;min-width:0;flex:1;color:#3c6353;font-size:12px;text-align:center}.process-arrow{color:#78a189}
.app-frame{background:#f2f6f2;padding:16px;border:1px solid #dce8df;border-radius:19px}
.app-frame iframe{display:block;width:100%;height:480px;border:0;border-radius:12px;background:white}
.app-frame figcaption{font-size:12px;color:#76877b;padding:12px 4px 0}
.feedback-section{background:#eef3ed}.feedback-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
.feedback-form{background:white;border:1px solid #e0e9e0;border-radius:20px;padding:27px;display:grid;gap:14px}
.feedback-form label{font-size:13px;color:#43584c;font-weight:680}.feedback-form textarea,.feedback-form select{display:block;width:100%;padding:13px 14px;border:1px solid #d7e1da;border-radius:11px;background:#fff;font:inherit;min-height:44px;margin-top:7px;color:#213a30}.feedback-form textarea{min-height:145px;resize:vertical}.feedback-form button{border:0;cursor:pointer}.feedback-form small{color:#7a8b80;font-size:12px}
.cta-band{background:#1c3933;padding:49px}.cta-band h2{font-size:clamp(1.8rem,3vw,2.7rem)}.cta-band .button{background:#e2f0e6;color:#1f4a3b}
.footer{background:#f9faf8;border-top:1px solid #e3eae3}.footer a{color:#537265}
.reveal{animation:rise-in .8s both}@keyframes rise-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:800px){.product-hero .hero-copy{padding-top:15px}}
@media(max-width:850px){.topnav{gap:11px}.topnav a:not(.language):not(.nav-cta){display:none}.hero-visual{padding:0 10px}.preview-hint{right:9px;top:52px}.preview-body{grid-template-columns:105px 1fr}.preview-sidebar{padding:16px 8px}.preview-main{padding:16px 10px}.preview-day{min-height:64px}.story-grid,.feedback-layout{grid-template-columns:1fr;gap:18px}}
@media(max-width:550px){.product-hero{padding-top:48px}.product-hero .hero-copy{margin-bottom:33px}.product-hero h1{font-size:clamp(2.6rem,10vw,3.6rem)}.hero-visual{padding:0 3px}.preview-body{grid-template-columns:0 1fr}.preview-sidebar{display:none}.preview-top{height:40px}.preview-main{padding:13px 7px}.preview-day{min-height:55px;padding:4px 2px}.preview-event{font-size:8px;padding:3px}.preview-mainheader strong{font-size:17px}.preview-hint{display:none}.section{padding:56px 0}.photo-block{min-height:365px}.photo-block .photo-copy{padding:24px}.story-panel{padding:25px}.process-step{font-size:10px;padding:11px 6px}.process-arrow{font-size:11px}.feedback-form{padding:19px}.app-frame iframe{height:390px}.mast .wrap{min-height:62px}}
@media(prefers-reduced-motion:reduce){.reveal{animation:none}.button,.card{transition:none}}
