/* About and PawHandoff: specific editorial layouts within the studio identity. */
.story-page h1,.story-page h2{font-weight:400}
.story-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center;padding-block:56px 64px}
.story-hero h1{font-size:clamp(45px,4.55vw,65px);line-height:1.08;letter-spacing:-2.3px}
.story-hero h1 span{display:block;color:var(--purple)}
.story-hero-copy>p{font-size:20px;line-height:1.65;margin-top:25px;max-width:510px}
.story-hero-copy>.text-link{margin-top:26px}
.story-portfolio{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;border-radius:10px;max-width:520px;justify-self:end;width:100%}
.story-app{position:relative;isolation:isolate;display:flex;align-items:center;flex-direction:column;padding:28px 18px 24px;background:#e9e2fd;text-align:center;min-width:0;overflow:hidden}
.story-app:nth-child(2){background:#ddf6ed;padding-top:44px}
.story-app::before{content:"";position:absolute;width:130px;height:180px;border:28px solid #c8b9f5;border-radius:100%;left:-102px;bottom:-50px;z-index:-1}
.story-app:nth-child(2)::before{border-color:#b4e9d8;left:auto;right:-105px;bottom:48px}
.story-app .phone{width:140px;max-width:100%;border-width:4px;border-radius:23px;box-shadow:0 9px 16px #3024431a}
.story-app figcaption{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:20px}
.story-app-icon{width:40px;height:40px;border-radius:10px}
.story-app-name{font-size:16px;font-weight:650;line-height:1.4;color:var(--ink);text-decoration:none}
.story-app-name:hover{text-decoration:underline;color:var(--purple)}
.story-app-status{font-size:13px;line-height:1.4;color:#535969}
.story-portfolio-note{grid-column:1/-1;text-align:center;padding:12px 14px;background:#f7f5fc;font-size:12px;line-height:1.5}
.story-editorial{display:grid;grid-template-columns:1fr 1.08fr;gap:70px;padding-block:58px;border-top:1px solid var(--line);align-items:start}
.story-editorial h2{font-size:clamp(36px,3.7vw,49px);line-height:1.14;letter-spacing:-1.7px}
.story-editorial p{font-size:18px;line-height:1.7}
.story-conversation{background:#fcece4}
.story-conversation .story-editorial{border-top:0;padding-block:52px}
.story-conversation .text-link{margin-top:24px}
.paw-page{--paw-green:#356d5d;--paw-sage:#e0ece5;--paw-cream:#f5eee1}
.paw-page .story-hero{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:70px}
.paw-page .story-hero h1{font-size:clamp(44px,4.8vw,68px)}
.paw-page .story-hero h1 span{color:var(--paw-green)}
.paw-page .story-hero-copy>.app-heading{font-size:23px;line-height:1.4;font-weight:650;color:var(--ink);margin-top:24px}
.paw-page .story-hero-copy>p:not(.app-heading):not(.paw-status){font-size:19px;margin-top:20px}
.paw-page .story-hero-copy>.paw-status{font-size:14px;border-left:3px solid var(--paw-green);padding:10px 0 10px 17px;line-height:1.65;margin-top:27px;color:#44584e}
.paw-page .button{background:var(--paw-green);border-color:var(--paw-green);border-radius:6px}
.paw-page .button:hover{background:#285846;border-color:#285846;box-shadow:0 7px 16px #356d5d20}
.paw-media{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:22px;max-width:440px;width:100%;justify-self:end;padding:38px 25px 23px;background:var(--paw-sage);border-radius:220px 220px 12px 12px}
.paw-media::before{content:"";position:absolute;z-index:-1;bottom:65px;left:26px;right:26px;height:62%;border-radius:200px 200px 0 0;background:var(--paw-cream)}
.paw-media::after{content:"";position:absolute;z-index:-1;bottom:65px;right:0;width:78px;height:90px;border-radius:100% 0 0;background:#eeb2a1}
.paw-media .product-id{gap:12px}
.paw-media .product-id img{width:47px;height:47px;border-radius:12px}
.paw-media .product-id strong{font-size:22px;line-height:1.3}
.paw-media .phone{width:190px;border-width:4px;border-radius:25px;box-shadow:0 10px 22px #35574a26}
.paw-media .image-note{max-width:255px;font-size:12px;margin-top:14px;color:#56665d}
.paw-plans{padding-block:4px 60px}
.paw-plans h2{max-width:840px;font-size:clamp(36px,3.7vw,49px)}
.paw-plans>p{font-size:17px;margin-top:17px;color:#606774}
.paw-plan-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:35px}
.paw-plan{position:relative;padding-top:24px}
.paw-plan::before{content:"";position:absolute;top:0;left:0;width:66px;height:4px;background:var(--paw-green)}
.paw-plan:nth-child(2)::before{background:#eaa18b}
.paw-plan:nth-child(3)::before{background:#9a7bdc}
.paw-plan h3{font-size:28px;margin-bottom:13px}
.paw-plan p{font-size:17px;line-height:1.7}
.paw-development{position:relative;overflow:hidden;background:var(--paw-sage)}
.paw-development .shell{position:relative;isolation:isolate;padding-block:46px 48px}
.paw-development h2{font-size:clamp(35px,3.6vw,47px);max-width:850px}
.paw-development p{font-size:18px;max-width:740px;line-height:1.7;margin-top:20px}
.paw-development .text-link{margin-top:23px}
.paw-development-mark{position:absolute;z-index:-1;right:0;bottom:-25px;width:170px;height:170px;fill:#c4d8cd;opacity:.75}
@media(max-width:1000px){.story-hero{gap:32px}.story-hero h1{font-size:49px}.story-hero-copy>p{font-size:18px}.story-app{padding-inline:12px}.story-app .phone{width:124px}.story-editorial{gap:44px}.paw-page .story-hero{gap:40px}.paw-page .story-hero h1{font-size:52px}.paw-page .story-hero-copy>p:not(.app-heading):not(.paw-status){font-size:18px}.paw-media .phone{width:178px}.paw-media{padding-inline:16px}.paw-plan-list{gap:28px}.paw-plan p{font-size:16px}.paw-development p{max-width:650px}.paw-development-mark{right:-40px;opacity:.45}}
@media(max-width:720px){.story-hero,.paw-page .story-hero{grid-template-columns:1fr;gap:32px;padding-block:38px 42px}.story-hero h1,.paw-page .story-hero h1{font-size:clamp(43px,8.4vw,58px);letter-spacing:-1.7px}.story-hero-copy>p{font-size:18px;margin-top:23px}.story-portfolio{max-width:none;justify-self:center}.story-app{padding:25px 16px 21px}.story-app:nth-child(2){padding-top:44px}.story-app .phone{width:140px}.story-app figcaption{margin-top:18px}.story-editorial{grid-template-columns:1fr;gap:24px;padding-block:39px}.story-editorial h2{font-size:37px;letter-spacing:-1.1px}.story-editorial p{font-size:17px}.story-conversation .story-editorial{padding-block:37px 40px}.paw-media{justify-self:center;max-width:480px;padding:34px 24px 22px;border-radius:200px 200px 12px 12px}.paw-media .phone{width:180px}.paw-page .story-hero-copy>.app-heading{font-size:21px}.paw-plans{padding-block:0 39px}.paw-plans h2{font-size:36px;letter-spacing:-1.1px}.paw-plan-list{grid-template-columns:1fr;gap:28px;margin-top:30px}.paw-plan{padding-top:18px}.paw-plan h3{font-size:28px;margin-bottom:10px}.paw-plan p{font-size:17px;max-width:520px}.paw-development .shell{padding-block:37px 41px}.paw-development h2{font-size:36px;max-width:520px}.paw-development p{font-size:17px;max-width:520px}.paw-development-mark{right:-65px;bottom:-45px;opacity:.3}}
@media(max-width:390px){.story-hero h1,.paw-page .story-hero h1{font-size:42px}.story-app{padding-inline:11px}.story-app .phone{width:115px;border-width:3px;border-radius:20px}.story-app-icon{width:35px;height:35px;border-radius:9px}.story-app-name{font-size:14px}.story-app-status{font-size:12px}.story-portfolio-note{font-size:11px;padding-inline:8px}.story-hero-copy>p{font-size:17px}.paw-media .phone{width:168px}.paw-media .product-id img{width:42px;height:42px}.paw-media .product-id strong{font-size:20px}.paw-page .story-hero-copy>.paw-status{font-size:13px}.story-editorial h2,.paw-plans h2,.paw-development h2{font-size:33px}}