/* A feature is two columns: explanation, then visual + testimonial beneath it. */
.project-features{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:30px}
.project-features .project-feature{align-items:start;height:100%;margin:0;gap:36px;padding:36px;grid-template-columns:minmax(0,1fr) minmax(0,1.07fr)}
.project-feature-media{min-width:0;display:grid;grid-template-rows:360px minmax(0,1fr);align-self:stretch;gap:24px}
.project-feature-media .project-feature-visual{width:100%;height:360px;min-width:0;min-height:0;align-self:start}
.project-feature-copy{display:flex;flex-direction:column;align-self:stretch}
.project-feature-copy dl{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:22px}
.project-feature-copy dl>div+div{margin-top:0}
.project-feature-copy>.btn{align-self:flex-start}
.project-feature-media .feature-social-proof{align-self:end}
.project-feature-media .feature-social-proof{display:flex;align-items:flex-start;grid-column:auto;gap:16px;border:0;padding:0;margin:0}
.project-feature-media .feature-social-proof>.community-avatar,.project-feature-media .feature-social-proof>.community-member-mark{width:64px;height:64px;flex:0 0 64px}
.project-feature-media .feature-social-proof>div{min-width:0;max-width:100%;padding:0}
.project-feature-media .feature-social-proof strong{font-size:13px;font-weight:500;line-height:1.6;margin:0 0 5px}
.project-feature-media .feature-social-proof blockquote{font-size:13px;font-style:normal;line-height:1.85;color:var(--navy);margin:0}
.testimony-example-note{display:block;font-size:8px;line-height:1.6;color:var(--sub);margin-top:7px}
.project-feature-visual>.tool-screen{height:100%;display:flex;flex-direction:column;box-shadow:none;border-radius:14px}
.project-feature-visual .tool-screen-bar{flex:none;padding:16px 18px;min-height:57px}
.project-feature-visual .tool-screen-body{flex:1;display:flex;flex-direction:column;justify-content:space-between;min-height:0;padding:18px}
.project-feature-visual .preview-task{padding:12px 0;min-height:54px}
.project-feature-visual .tool-screen-body>p{margin:14px 0 0}
.project-feature-visual .tool-screen-photo{height:164px;flex:none}
.project-feature-visual .terrain-preview-facts{flex:1;padding:13px 18px;gap:10px;align-content:center}
.project-feature-visual .screen-footnote{flex:none;font-size:8px;padding:0 18px 13px;line-height:1.6}
.project-feature-visual .preview-pros{flex:1;display:flex;flex-direction:column;padding:0 18px 12px;min-height:0}
.project-feature-visual .preview-pros>div{flex:1;gap:12px;padding:12px 0;min-height:0}
.project-feature-visual .preview-pros>div>img:first-child{width:86px;height:65px}
.project-feature-visual>.hp-demo{height:100%;display:grid;grid-template-rows:32px 60px minmax(0,1fr) 48px;border-radius:14px;box-shadow:none}
.project-feature-visual .hp-demo__top{padding:10px 16px 6px;min-height:0;align-self:start}
.project-feature-visual .hp-demo__eyebrow{font-size:11px}
.project-feature-visual .hp-demo__step{font-size:9px}
.project-feature-visual .hp-demo__dialogue{padding:0 14px 8px;min-height:0}
.project-feature-visual .hp-demo__message{width:100%;max-width:100%;padding:7px 10px;gap:8px;align-items:center}
.project-feature-visual .hp-demo__speaker{font-size:9px}
.project-feature-visual .hp-demo__message p{font-size:11px!important;line-height:1.5!important}
.project-feature-visual .hp-demo__drawing{padding:7px 10px;min-height:0;display:flex;align-items:center;justify-content:center}
.project-feature-visual .hp-demo__svg{width:100%;height:100%;max-width:none;object-fit:contain}
.project-feature-visual .hp-demo__caption{display:none}
.project-feature-visual .hp-demo__bottom{padding:4px 10px 6px;gap:4px;flex-wrap:nowrap;min-width:0;align-items:center}
.project-feature-visual .hp-demo__disclaimer{font-size:8px;line-height:1.5;max-width:170px}
.project-feature-visual .hp-demo__controls{gap:0;flex:none}
.project-feature-visual .hp-demo__controls button{font-size:10px;padding:6px;min-height:36px}
/* The former wedding-website analogy becomes a useful public starting point. */
.journey-layout{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);border:1px solid var(--line);border-radius:24px;overflow:hidden;background:#fff}
.journey-photo{position:relative;min-width:0;margin:0;min-height:100%;overflow:hidden}
.journey-photo>img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:73% center}
.journey-photo::after{content:'';position:absolute;inset:48% 0 0;background:linear-gradient(transparent,#1f1f54b3)}
.journey-photo figcaption{position:absolute;bottom:27px;left:28px;right:24px;z-index:1;color:white;font-size:25px;font-weight:500;line-height:1.5}
.journey-photo figcaption small{display:block;font-size:9px;font-weight:400;margin-top:12px}
.journey-content{min-width:0;padding:36px}
.journey-content>.eyebrow{font-size:10px;margin-bottom:9px;display:block}
.journey-content h2{font-size:29px;font-weight:500;line-height:1.3;letter-spacing:-.6px;margin:0 0 15px}
.journey-intro{font-size:13px;line-height:1.8;color:var(--sub);margin:0 0 22px}
.journey-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line);gap:8px;margin-bottom:22px}
.journey-choices>button{appearance:none;font:inherit;font-size:11px;line-height:1.6;text-align:left;color:var(--navy);background:white;border:0;border-bottom:3px solid transparent;padding:10px 5px 13px;display:flex;flex-direction:column;gap:9px;min-width:0;cursor:pointer}
.journey-choices>button[aria-pressed=true]{border-bottom-color:var(--cyan);font-weight:500}
.journey-choices>button:hover{background:var(--pale)}
.journey-choices>button:focus-visible{outline:2px solid var(--navy);outline-offset:2px;border-radius:6px}
.journey-choices .brand-icon{width:27px;height:29px;object-fit:contain}
.journey-panel{min-height:275px}
.journey-panel h3{font-size:18px;line-height:1.5;font-weight:500;margin:0 0 8px}
.journey-panel>p{font-size:12px;line-height:1.8;color:var(--sub);margin:0 0 12px;min-height:43px}
.journey-panel ul{padding:0;margin:0 0 19px;list-style:none;display:grid;gap:2px}
.journey-panel li>a{display:flex;justify-content:space-between;gap:12px;font-size:11px;line-height:1.65;min-height:34px;align-items:center;padding:6px 0}
.journey-panel li>a:hover{text-decoration:underline;text-underline-offset:3px}
.journey-panel .btn{font-size:12px;line-height:1.6;min-height:46px;white-space:normal}
.journey-access{font-size:10px;color:var(--sub);margin:14px 0 0;line-height:1.6}
@media(min-width:801px) and (max-width:1050px){
 .project-features .project-feature{padding:28px;gap:26px}
 .project-feature-media{grid-template-rows:360px minmax(0,1fr);gap:21px}
 .project-feature-media .project-feature-visual{height:360px}
 .project-feature-visual>.hp-demo{grid-template-rows:32px 60px minmax(0,1fr) 70px}
 .project-feature-visual .hp-demo__bottom{flex-wrap:wrap;padding:3px 8px;gap:0}
 .project-feature-visual .hp-demo__disclaimer{font-size:9px;max-width:100%;line-height:1.5}
 .project-feature-visual .hp-demo__controls button{font-size:11px;min-height:44px;padding:3px 7px}
 .project-feature-media .feature-social-proof{gap:12px}
 .project-feature-media .feature-social-proof>.community-avatar,.project-feature-media .feature-social-proof>.community-member-mark{width:48px;height:48px;flex-basis:48px}
 .journey-content{padding:28px}
 .journey-photo figcaption{left:22px;font-size:22px}
 .journey-content h2{font-size:27px}
}
@media(max-width:800px){
 .project-features{grid-auto-rows:auto;gap:25px}
 .project-features .project-feature{height:auto;grid-template-columns:minmax(0,1fr);padding:28px;gap:26px}
 .project-feature-media{grid-template-rows:400px auto;gap:21px;max-width:600px;width:100%;justify-self:center}
 .project-feature-media .project-feature-visual{height:400px}
 .project-feature-media .feature-social-proof blockquote{font-size:13px}
 .journey-layout{grid-template-columns:minmax(0,1fr)}
 .journey-photo{min-height:0;height:245px}
 .journey-photo>img{object-position:70% 51%}
 .journey-photo figcaption{font-size:22px;bottom:19px;left:25px}
 .journey-photo::after{inset:15% 0 0;background:linear-gradient(transparent,#1f1f546e)}
 .journey-content{padding:28px}
 .journey-panel{min-height:260px}
 .journey-panel li>a{font-size:12px;min-height:44px}
}
@media(max-width:520px){
 .project-features .project-feature{padding:24px 18px;gap:24px}
 .project-feature-media{grid-template-rows:370px auto;gap:22px}
 .project-feature-media .project-feature-visual{height:370px}
 .project-feature-visual .hp-demo__message{display:flex;align-items:center;gap:7px;padding:6px 9px}
 .project-feature-visual .hp-demo__speaker{margin:0;font-size:8px}
 .project-feature-visual .hp-demo__message p{font-size:10px!important}
 .project-feature-visual>.hp-demo{grid-template-rows:32px 60px minmax(0,1fr) 70px}
 .project-feature-visual .hp-demo__bottom{flex-wrap:wrap;gap:0;padding:2px 8px}
 .project-feature-visual .hp-demo__disclaimer{font-size:9px;line-height:1.5;max-width:100%}
 .project-feature-visual .hp-demo__controls button{font-size:11px;min-height:44px;padding:3px 7px}
 .project-feature-media .feature-social-proof{gap:12px}
 .project-feature-media .feature-social-proof>.community-avatar,.project-feature-media .feature-social-proof>.community-member-mark{width:45px;height:45px;flex-basis:45px}
 .project-feature-media .feature-social-proof blockquote{font-size:12px}
 .testimony-example-note{font-size:8px}
 .project-feature-visual .tool-screen-photo{height:137px}
 .project-feature-visual .terrain-preview-facts{font-size:10px;grid-template-columns:1fr}
 .project-feature-visual .terrain-preview-facts>div{grid-template-columns:83px minmax(0,1fr);font-size:10px;gap:9px}
 .project-feature-visual .preview-pros>div>img:first-child{width:61px;height:60px}
 .journey-layout{border-radius:20px}
 .journey-photo{height:220px}
 .journey-photo figcaption{font-size:20px;left:20px}
 .journey-content{padding:25px 20px}
 .journey-content h2{font-size:27px}
 .journey-intro{font-size:12px}
 .journey-choices{gap:6px}
 .journey-choices>button{font-size:10px;line-height:1.65;padding-inline:3px;min-height:98px}
 .journey-choices .brand-icon{width:25px;height:27px}
 .journey-panel{min-height:305px}
 .journey-panel h3{font-size:18px}
 .journey-panel li>a{font-size:11px}
 .journey-panel .btn{width:100%;font-size:11px}
}