.about-story { color:#202325; overflow:clip; }
.about-story-shell { width:min(100% - 64px,1280px); margin-inline:auto; }
.about-story h1,.about-story h2,.about-story h3 { letter-spacing:0; color:inherit; }
.about-story p { font-size:18px; line-height:1.65; color:inherit; }
.about-story section > div > span,.about-story-section-heading > span,.about-story-feature > div > span { display:block; margin-bottom:20px; font-size:13px; font-weight:700; }
.about-story-hero { position:relative; display:flex; align-items:end; min-height:560px; height:min(80svh,780px); padding:140px 0 70px; color:#fff; background:#30393c; }
.about-story-hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.about-story-hero::after { content:""; position:absolute; inset:0; background:rgba(12,20,23,.53); }
.about-story-hero .about-story-shell { position:relative; z-index:1; }
.about-story-hero h1 { margin:0 0 22px; font-size:96px; line-height:1; font-weight:750; }
.about-story-hero p { max-width:650px; margin:0; font-size:30px; line-height:1.3; }
.about-story-intro { display:grid; grid-template-columns:1.2fr 1fr; align-items:start; gap:80px; padding-block:110px 100px; }
.about-story-intro h2 { max-width:670px; margin:0; font-size:36px; line-height:1.3; font-weight:650; }
.about-story-intro p { margin:0; color:#646b70; }
.about-story-gallery { display:grid; grid-template-columns:1fr 1.25fr 1fr; align-items:center; gap:32px; padding:40px 32px 100px; }
.about-story-gallery figure { height:360px; margin:0; overflow:hidden; border-radius:8px; transform:translate3d(var(--pointer-x,0px),var(--drift,0px),0); will-change:transform; }
.about-story-gallery figure:nth-child(2) { height:460px; }
.about-story-gallery img { display:block; width:100%; height:100%; object-fit:cover; }
.about-story-manifesto { padding-block:100px; background:#dfeae4; }
.about-story-manifesto h2 { max-width:1000px; margin:0 0 70px; font-size:42px; line-height:1.35; font-weight:600; }
.about-story-principles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; border-top:1px solid #adbbb1; padding-top:28px; }
.about-story-principles p { margin:0; font-size:16px; }
.about-story-journey { padding-block:110px; }
.about-story-section-heading h2 { max-width:650px; margin:0 0 60px; font-size:44px; font-weight:650; }
.about-story-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; }
.about-story-steps article { border-top:1px solid #d1d8d6; padding-top:24px; }
.about-story-step-number { display:block; margin-bottom:36px; color:#697c70; font-size:14px; }
.about-story-steps h3 { margin:0 0 16px; font-size:25px; font-weight:650; }
.about-story-steps p { color:#68706d; font-size:16px; }
.about-story-feature { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:90px; padding-bottom:110px; }
.about-story-feature-image { background:#f0eef5; padding:36px; border-radius:8px; }
.about-story-feature img { width:100%; height:auto; }
.about-story-feature h2,.about-story-finale h2 { margin:0 0 24px; font-size:40px; line-height:1.25; font-weight:650; }
.about-story-feature p { color:#656c70; }
.about-story-finale { background:#f0e8ed; padding-block:90px; }
.about-story-finale > div { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.about-story-finale img { width:100%; max-height:480px; object-fit:contain; }
.about-story-link { display:inline-flex; gap:24px; align-items:center; margin-top:20px; padding:15px 22px; border-radius:8px; background:#25282a; color:#fff!important; font-size:16px; text-decoration:none; }
.about-story-link:hover { background:#3c4642; }
.about-motion-ready [data-about-reveal] { opacity:0; transform:translateY(26px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.25,1); }
.about-motion-ready [data-about-reveal].is-visible { opacity:1; transform:none; }
@media(max-width:767px) {
  .about-story-shell { width:calc(100% - 40px); }
  .about-story-hero { min-height:560px; height:78svh; padding-block:120px 44px; }
  .about-story-hero h1 { font-size:56px; }
  .about-story-hero p { font-size:24px; }
  .about-story-intro { grid-template-columns:1fr; gap:28px; padding-block:64px; }
  .about-story-intro h2 { font-size:28px; }
  .about-story p { font-size:16px; }
  .about-story-hero p { font-size:24px; }
  .about-story-gallery { grid-template-columns:1fr 1fr; gap:14px; padding:22px 20px 70px; }
  .about-story-gallery figure,.about-story-gallery figure:nth-child(2) { height:240px; }
  .about-story-gallery figure:last-child { grid-column:1 / -1; height:220px; }
  .about-story-manifesto,.about-story-finale { padding-block:64px; }
  .about-story-manifesto h2 { font-size:28px; margin-bottom:36px; }
  .about-story-principles,.about-story-steps { grid-template-columns:1fr; gap:24px; }
  .about-story-journey { padding-block:64px; }
  .about-story-section-heading h2 { font-size:32px; margin-bottom:32px; }
  .about-story-step-number { margin-bottom:20px; }
  .about-story-feature,.about-story-finale > div { grid-template-columns:1fr; gap:36px; }
  .about-story-feature { padding-bottom:64px; }
  .about-story-feature h2,.about-story-finale h2 { font-size:30px; }
}
@media(prefers-reduced-motion:reduce) {
  .about-motion-ready [data-about-reveal] { opacity:1; transform:none; transition:none; }
  .about-story-gallery figure { transform:none!important; will-change:auto; }
}