/* Width and gutters come only from the shared .wrap in site.css.
   This file controls the layout inside that container, never its outer width. */
.page-flow{--flow-serif:'Yu Mincho','YuMincho','Hiragino Mincho ProN','Noto Serif JP','MS PMincho',serif;--flow-navy:#182d60;--flow-blue:#8b9fc4;--flow-paper:#f5f8fc}
.page-flow .page-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);column-gap:80px;min-height:0;padding-top:28px;padding-bottom:42px}
.page-flow .page-hero .breadcrumb{grid-column:1/-1;margin-bottom:30px}
.page-flow .page-hero>.eyebrow{grid-column:1;margin-bottom:14px}
.page-flow .page-hero h1{grid-column:1;margin:0;font-family:var(--flow-serif);font-size:44px;font-weight:500;line-height:1.55;letter-spacing:.045em}
.page-flow .page-hero .page-intro{grid-column:2;grid-row:3;align-self:center;max-width:450px;margin:0;font-size:14px;line-height:2.15;color:#61708b}
.page-flow .page-hero .page-index{display:none}
.page-flow .flow-photo{border-radius:6px;overflow:hidden}
.page-flow .flow-photo img{height:280px;max-height:none;object-fit:cover;object-position:center}
.page-flow .flow-journey{background:linear-gradient(180deg,#fff 0,var(--flow-paper) 160px);padding:72px 0 88px;color:var(--flow-navy)}
.page-flow .flow-shell{display:grid;grid-template-columns:minmax(0,35%) minmax(0,1fr);gap:5%;align-items:start}
.flow-intro{position:sticky;top:112px;height:min(960px,calc(100svh - 184px));min-height:500px;isolation:isolate}
.flow-backdrop{position:absolute;z-index:-1;inset:-25px 0 -20px;width:100%;height:calc(100% + 45px);max-width:none;object-fit:cover;object-position:center bottom;mask-image:linear-gradient(90deg,#000 75%,transparent),linear-gradient(180deg,transparent,#000 5%,#000 93%,transparent);mask-composite:intersect;pointer-events:none}
.flow-intro-copy{padding:8px 28px 0;overflow-wrap:anywhere}
.flow-eyebrow{display:flex;align-items:center;gap:22px;color:#8095bc;font-size:10px;font-weight:700;letter-spacing:.18em;line-height:1.6;margin-bottom:23px}
.flow-eyebrow:after{content:"";height:1px;width:54px;background:#8fa3c8}
.page-flow .flow-intro h2{font-family:var(--flow-serif);font-size:36px;font-weight:500;line-height:1.6;letter-spacing:.04em;color:var(--flow-navy);margin:0 0 22px}
.page-flow .flow-description{font-family:var(--flow-serif);font-size:14px;line-height:2.1;letter-spacing:.025em;color:#4a5e85}
.flow-motto{margin-top:29px;font-size:9px;letter-spacing:.28em;line-height:2;color:#819ac4;font-weight:700}
.flow-motto:before{content:"";display:block;width:62px;height:1px;background:#8fa3c8;margin-bottom:14px}
.flow-signoff{position:absolute;left:28px;right:28px;bottom:3px;color:#526b95}
.flow-signoff>p:first-child{font-family:'Segoe Script','Bradley Hand',cursive;font-size:20px;font-style:italic;font-weight:400;line-height:1.1;transform:rotate(-7deg);margin-bottom:24px;color:#819ac4}
.flow-signoff>p:first-child span{padding-left:20px;font-size:17px}
.flow-signoff>p:last-child{font-family:var(--serif);font-size:12px;line-height:1.85;letter-spacing:.08em}
.flow-steps{position:relative;padding:0;margin:0;list-style:none}
.flow-steps:before{content:"";position:absolute;left:-23px;top:16px;bottom:16px;width:1px;background:#d0dcf0}
.page-flow .flow-steps>.flow-step{display:grid;grid-template-columns:32px 56px minmax(0,1fr);gap:18px;align-items:center;position:relative;min-height:150px;padding:23px 22px;margin:0 0 16px;border:1px solid #e6edf7;border-radius:12px;background:rgba(255,255,255,.92);box-shadow:0 5px 24px #aabddb06}
.flow-steps>.flow-step:before{content:"";position:absolute;left:-29px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#869dc5}
.flow-number{font-family:Georgia,'Times New Roman',serif;font-size:34px;line-height:1;font-weight:400;letter-spacing:-.04em;color:#97a7c7;align-self:start;padding-top:8px}
.flow-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#f2f5fa;color:#3e5788}
.flow-icon svg{width:32px;height:32px}
.flow-step-copy{min-width:0}
.flow-step-copy .flow-step-name{font-family:var(--serif);font-size:13px;line-height:1.5;letter-spacing:.08em;font-weight:600;color:#8a9fc4;margin:0 0 6px}
.page-flow .flow-step-copy h3{font-family:var(--flow-serif);font-size:23px;font-weight:500;letter-spacing:.015em;line-height:1.6;margin:0 0 7px;color:var(--flow-navy)}
.page-flow .flow-steps .flow-step-copy .flow-step-description{font-family:var(--font);font-size:13px;line-height:1.95;letter-spacing:.01em;color:#617393;margin:0}
.admin-bar .flow-intro{top:144px;height:min(960px,calc(100svh - 216px))}
@media(min-width:901px) and (max-height:780px){
 .flow-intro{min-height:450px}
 .flow-backdrop{object-fit:contain}
 .page-flow .flow-intro h2{font-size:36px;margin-bottom:16px}
 .flow-intro-copy{padding-top:8px}
 .flow-eyebrow{margin-bottom:16px}
 .page-flow .flow-description{font-size:13px;line-height:1.9}
 .flow-motto{margin-top:20px;font-size:8px}
 .flow-signoff>p:first-child{font-size:17px;margin-bottom:18px}
 .flow-signoff>p:first-child span{font-size:14px}
 .flow-signoff>p:last-child{font-size:11px}
}
@media(max-width:1100px) and (min-width:901px){
 .page-flow .flow-shell{grid-template-columns:minmax(0,36%) minmax(0,1fr);gap:5%}
 .page-flow .flow-steps>.flow-step{grid-template-columns:28px 48px minmax(0,1fr);gap:13px;padding:21px 18px}
 .flow-icon{width:48px;height:48px}.flow-icon svg{width:27px;height:27px}
 .flow-number{font-size:29px}.page-flow .flow-intro h2{font-size:32px}
 .page-flow .flow-step-copy h3{font-size:20px}.page-flow .flow-steps .flow-step-copy .flow-step-description{font-size:12px}
 .flow-eyebrow{font-size:8px;gap:15px}.flow-eyebrow:after{width:30px}
 .page-flow .flow-description{font-size:12px}
}
@media(max-width:900px){
 .page-flow .page-hero{column-gap:40px;padding-bottom:34px}
 .page-flow .page-hero h1{font-size:32px}
 .page-flow .page-hero .page-intro{font-size:12px}
 .page-flow .flow-journey{padding-top:48px;padding-bottom:56px}
 .page-flow .flow-shell{display:block}
 .flow-intro,.admin-bar .flow-intro{position:relative;top:auto;height:590px;min-height:0;margin:0 auto 32px}
 .flow-backdrop{inset:-15px 0 -10px;width:100%;height:calc(100% + 25px);object-fit:cover;object-position:center 64%;mask-image:linear-gradient(180deg,transparent,#000 5%,#000 90%,transparent)}
 .flow-intro-copy{padding-top:8px}
 .page-flow .flow-intro h2{font-size:36px;margin-bottom:20px}
 .page-flow .flow-description{font-size:14px}.flow-eyebrow{font-size:9px;margin-bottom:20px}
 .flow-motto{margin-top:25px}
 .flow-signoff{bottom:5px}
 .flow-steps{margin-left:15px}
 .flow-steps:before{left:-15px}
 .flow-steps>.flow-step:before{left:-20px;width:8px;height:8px;margin-top:-4px}
 .page-flow .flow-steps>.flow-step{grid-template-columns:32px 55px minmax(0,1fr);gap:16px;min-height:140px;padding:22px}
 .flow-icon{width:55px;height:55px}.page-flow .flow-step-copy h3{font-size:23px}
}
@media(max-width:650px){
 .page-flow .page-hero{display:block;padding-top:22px;padding-bottom:28px}
 .page-flow .page-hero .breadcrumb{margin-bottom:24px}
 .page-flow .page-hero>.eyebrow{margin-bottom:12px}
 .page-flow .page-hero h1{font-size:30px;line-height:1.6}
 .page-flow .page-hero .page-intro{font-size:12px;line-height:2;margin-top:18px}
 .page-flow .flow-photo img{height:200px}
 .page-flow .flow-journey{padding-top:42px}
}
@media(max-width:500px){
 .flow-intro-copy{padding-inline:24px}
 .flow-signoff{left:24px;right:24px}
 .flow-intro,.admin-bar .flow-intro{height:620px}
 .flow-backdrop{object-position:center bottom;inset:-10px 0 -10px;width:100%;height:calc(100% + 20px)}
 .page-flow .flow-intro h2{font-size:clamp(29px,8.2vw,36px);line-height:1.6}
 .page-flow .flow-description{font-size:clamp(11px,3.25vw,14px);line-height:2}
 .flow-motto{margin-top:22px;font-size:8px}
 .flow-signoff>p:first-child{font-size:17px}.flow-signoff>p:first-child span{font-size:15px}
 .flow-signoff>p:last-child{font-size:11px}
 .flow-steps{margin-left:12px}
 .flow-steps:before{left:-13px}
 .page-flow .flow-steps>.flow-step{grid-template-columns:30px minmax(0,1fr);gap:11px 13px;padding:20px 16px;min-height:0;margin-bottom:14px;border-radius:12px}
 .flow-steps>.flow-step:before{left:-18px;top:42px}
 .flow-number{font-size:28px;grid-row:1;align-self:center;padding:0}
 .flow-icon{width:43px;height:43px;grid-column:2;grid-row:1;justify-self:start}
 .flow-icon svg{width:25px;height:25px}
 .flow-step-copy{grid-column:1/-1}
 .flow-step-copy .flow-step-name{font-size:11px;margin-bottom:5px}
 .page-flow .flow-step-copy h3{font-size:clamp(17px,4.7vw,22px);margin-bottom:7px;line-height:1.65}
 .page-flow .flow-steps .flow-step-copy .flow-step-description{font-size:12px;line-height:1.95}
}
@media(min-width:901px) and (max-height:600px){.flow-intro,.admin-bar .flow-intro{position:relative;top:0;height:550px;min-height:0}}
@media print{.flow-intro,.admin-bar .flow-intro{position:relative;top:0;height:650px}.flow-steps>.flow-step{break-inside:avoid}.page-flow .flow-shell{display:block}.flow-backdrop{max-width:100%;left:0}}