/* V4: individually art-directed pages. Separate from application styling. */
.h4-hero{min-height:710px;background-size:cover;background-position:center center;isolation:isolate}
.h4-hero .detail-hero-inner{min-height:625px;padding-bottom:90px}.h4-hero .detail-intro{max-width:860px;position:relative;z-index:3}
.h4-hero h1{font-size:clamp(3.7rem,6.4vw,7rem);line-height:1.04;letter-spacing:-.055em;font-weight:690;max-width:880px}
.h4-hero h1 em{font-style:normal;background:linear-gradient(108deg,#f2f7fd,#63bdfa 52%,#a486f9);-webkit-background-clip:text;background-clip:text;color:transparent}
.h4-hero .hero-overlay{background:linear-gradient(90deg,rgba(2,12,28,.97),rgba(2,12,28,.88) 34%,rgba(2,12,28,.21) 83%),linear-gradient(0deg,rgba(2,12,28,.65),transparent 42%)}
.h4-trust-ribbon{border-block:1px solid #37719870;background:#06162b;padding:21px 0}
.h4-trust-ribbon .shell{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:.71rem;letter-spacing:.19em;color:#a9cbe8;font-weight:700}
.h4-intro{padding-block:120px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:7%;align-items:center}
.h4-intro h2,.h4-section-head h2{font-size:clamp(2.5rem,4.4vw,4.7rem);line-height:1.08;letter-spacing:-.047em;color:#f1f6ff;margin:18px 0 24px}
.h4-intro p,.h4-section-head p{font-size:1.16rem;line-height:1.8;color:#b9c9da;max-width:590px}
.h4-overline{font-size:.67rem;letter-spacing:.21em;color:#79bffd;font-weight:750;display:block}
.h4-intro-photo{height:470px;overflow:hidden;border:1px solid #5585b75c;border-radius:4px;box-shadow:0 38px 80px #01070f80;position:relative}
.h4-intro-photo:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 90px #031326;pointer-events:none}
.h4-intro-photo img{width:100%;height:100%;object-fit:cover;transition:transform 1s}.h4-intro-photo:hover img{transform:scale(1.04)}
.h4-steps{background:linear-gradient(135deg,#041325,#102443 65%,#061729);border-block:1px solid #487ab334;padding:96px 0 110px}
.h4-section-head{max-width:810px;margin-bottom:40px}.h4-step-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.h4-step-grid article{background:linear-gradient(150deg,#142c49,#08182d);border:1px solid #4d82b54f;padding:42px 36px;min-height:280px;transition:transform .3s,border-color .3s}
.h4-step-grid article:hover{transform:translateY(-6px);border-color:#77c3ff}.h4-step-grid small{font-size:.86rem;letter-spacing:.18em;color:#8c9aff}
.h4-step-grid h3{color:#eff7ff;font-size:1.6rem;margin:32px 0 13px}.h4-step-grid p{color:#b9cadc;line-height:1.7}
.h4-product{padding-block:100px 130px}.h4-proof-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.h4-proof-card{background:#0a1b30;border:1px solid #567aa048;overflow:hidden;transition:transform .3s,border .3s}
.h4-proof-card:hover{transform:translateY(-7px);border-color:#65aaff}.h4-proof-image{height:250px;background:#eaf0f7;overflow:hidden}
.h4-proof-image img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s}.h4-proof-card:hover img{transform:scale(1.055)}
.h4-proof-card>div:last-child{padding:25px}.h4-proof-card h3{color:#fff;font-size:1.4rem;margin:12px 0}.h4-proof-card p{color:#bbcadb;line-height:1.55}
.h4-photo-quote{padding:130px 0;background-size:cover;background-position:center;min-height:440px;border-block:1px solid #5084b34e}
.h4-photo-quote h2{font-size:clamp(2.6rem,5vw,5.5rem);max-width:900px;letter-spacing:-.045em;line-height:1.07;color:#fff;margin:22px 0}
.h4-photo-quote p{font-size:1.2rem;color:#d6e6f8}.h4-actions{display:flex;gap:16px;margin-top:28px;flex-wrap:wrap}
.h4-solutions{padding-block:70px 120px}.h4-sol-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.h4-solution{display:grid;grid-template-columns:44% 1fr;min-height:340px;background:#0a2139;text-decoration:none;border:1px solid #527d9f5a;overflow:hidden}
.h4-sol-image{background-image:var(--s-photo);background-size:cover;background-position:center;transition:transform .6s}.h4-solution:hover .h4-sol-image{transform:scale(1.055)}
.h4-sol-text{padding:45px 30px;position:relative;background:#081b31}.h4-sol-text h3{font-size:1.9rem;color:#fff;margin:24px 0 14px}.h4-sol-text p{color:#c2d3e7;line-height:1.65}.h4-sol-text b{color:#76c4ff;display:block;margin-top:28px}
.h4-pricing{padding-block:60px 125px}.h4-price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.h4-price-card{background:linear-gradient(165deg,#183352,#071729);border:1px solid #6398c56b;padding:44px 35px;min-height:350px}
.h4-price-card h3{color:#f3f8ff;font-size:1.9rem;line-height:1.15;margin:26px 0}.h4-price-card p{color:#becfe4;line-height:1.7}.h4-arrow{display:block;color:#7dbef8;font-weight:700;margin-top:30px}
.h4-contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding-bottom:100px}.h4-linkcard{background:#102840;border:1px solid #6b9bc35e;text-decoration:none;padding:32px;transition:transform .3s}.h4-linkcard:hover{transform:translateY(-6px)}.h4-linkcard span{color:#8fbcf4;letter-spacing:.17em;font-size:.7rem}.h4-linkcard h3{color:white;font-size:1.6rem;margin:26px 0}.h4-linkcard p{color:#c9d6e2}.h4-linkcard b{color:#7ac8ff;display:block;margin-top:30px}
@media(max-width:900px){.h4-intro,.h4-sol-grid,.h4-proof-grid,.h4-price-grid,.h4-contact-cards,.h4-step-grid{grid-template-columns:1fr}.h4-intro{padding-block:65px}.h4-proof-image{height:340px}.h4-intro-photo{height:320px}.h4-hero{min-height:620px}.h4-hero h1{font-size:clamp(3.2rem,10vw,5rem)}}
@media(max-width:560px){.h4-solution{grid-template-columns:1fr}.h4-sol-image{height:200px}.h4-trust-ribbon .shell{justify-content:center}.h4-intro-photo{height:230px}.h4-proof-image{height:215px}.h4-hero h1{font-size:clamp(2.7rem,11vw,4rem)}}
@media(prefers-reduced-motion:reduce){.h4-proof-card,.h4-step-grid article,.h4-sol-image,.h4-intro-photo img{transition:none}}

/* COM-01 Starter Deployment footer line */
.h4-starter-foot{display:flex;flex-wrap:wrap;gap:20px 32px;align-items:center;margin-top:36px}.h4-starter-foot p{color:#b9cadc;margin:0;max-width:640px;line-height:1.7}
/* Editorial pass (21 Oct 2026): one benefit headline and one sentence beside each product screenshot. */
.pho-lite{border-left:3px solid #4d82b5;padding:4px 0 4px 22px}
.pho-lite h3{font-size:1.45rem;line-height:1.25;letter-spacing:-.02em;margin:0 0 10px;color:inherit}
.pho-lite p{margin:0;font-size:1.02rem;line-height:1.65;opacity:.86}