/* One visible preparation path. The shipping journey and quote form retain their own roles. */
.shipping-prep{background:#f7fbfe}
.prep-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr);align-items:center;gap:clamp(28px,5vw,78px);padding-block:62px 54px}
.prep-hero-copy{max-width:740px}
.prep-hero h1{font-size:clamp(38px,4.25vw,66px);line-height:1.16;letter-spacing:-.045em;color:#083b5a;text-wrap:balance}
html[dir=rtl] .prep-hero h1{line-height:1.38;letter-spacing:0}
.prep-hero p{max-width:630px;margin-top:22px;font-size:17px;line-height:1.8;color:#42677e}
.prep-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;margin-top:30px}
.prep-actions .btn{min-height:52px}
.prep-actions .text-link{font-size:15px}
.prep-hero-art{position:relative;display:flex;justify-content:space-between;align-items:center;gap:10px;isolation:isolate;min-height:190px;padding:30px 15px}
.prep-hero-art:before{content:"";position:absolute;inset:5% 0;border:1px solid #cfe8f4;border-radius:28px;background:linear-gradient(135deg,#e5f5fb,#fff 72%);z-index:-2}
.prep-line{position:absolute;inset-inline:45px;top:50%;height:2px;background:linear-gradient(90deg,#159bd8,#ef3651);z-index:-1}
.prep-hero-art span{display:grid;place-items:center;width:64px;height:64px;border:1px solid #b9dfee;border-radius:18px;background:white;color:#148dcb;box-shadow:0 9px 24px #0d5d870b}
.prep-hero-art span:last-child{color:#ec2348;border-color:#f6c5ce}
.prep-hero-art svg{width:30px;height:30px}

.prep-layout{display:grid;grid-template-columns:minmax(240px,.32fr) minmax(0,1fr);align-items:start;gap:clamp(30px,4vw,64px);padding-bottom:48px}
.prep-index{position:sticky;top:110px;border:1px solid #d4e8f2;border-radius:20px;background:white;padding:26px}
.prep-index h2{font-size:21px;line-height:1.45;color:#0b3e5b;margin:0 0 17px}
.prep-index nav{display:grid;gap:4px}
.prep-index nav a{display:flex;align-items:center;gap:12px;padding:12px 10px;border-radius:10px;color:#265d7a;font-size:15px;font-weight:700;line-height:1.55;text-decoration:none}
.prep-index nav a:hover,.prep-index nav a:focus-visible{background:#e9f7fd;color:#007ebc}
.prep-index nav svg{width:20px;height:20px;color:#1199d7;flex:none}
.prep-index-note{border-top:1px solid #d8eaf3;margin-top:19px;padding-top:19px}
.prep-index-note strong{font-size:15px;color:#0b3e5b}
.prep-index-note p{font-size:14px;line-height:1.75;color:#4b6d81;margin:8px 0 15px}
.prep-index-note .text-link{font-size:14px}

.prep-stages{min-width:0}
.prep-stage{scroll-margin-top:108px;margin-bottom:30px;border:1px solid #d5e8f2;border-radius:22px;background:white;overflow:hidden}
.prep-stage:last-child{margin-bottom:0}
.prep-stage-heading{display:flex;align-items:center;gap:16px;padding:23px 27px;border-bottom:1px solid #e0edf4}
.prep-stage-icon{display:grid;place-items:center;width:45px;height:45px;flex:none;border-radius:12px;background:#e7f6fd;color:#0794d6}
.prep-stage-icon svg{width:24px;height:24px}
.prep-stage h2{font-size:clamp(23px,2vw,30px);line-height:1.42;color:#093d5b;margin:0}
.prep-rows{padding:0 27px}
.prep-row{display:grid;grid-template-columns:22px minmax(0,1fr);gap:15px;padding:20px 0}
.prep-row+.prep-row{border-top:1px solid #e4eef4}
.prep-row-mark{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#ecf8fd;color:#078ecb;margin-top:3px}
.prep-row-mark svg{width:15px;height:15px}
.prep-row h3{font-size:18px;line-height:1.5;color:#103f5c;margin:0 0 6px}
.prep-row p{font-size:15px;line-height:1.78;color:#456b80;margin:0;max-width:850px}

.prep-finish{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:32px 36px;margin-bottom:40px;background:#e5f5fb;border:1px solid #cbe7f4;border-radius:22px}
.prep-finish>div{max-width:690px}
.prep-finish h2{font-size:clamp(24px,2.3vw,34px);line-height:1.45;color:#083d5b;margin:0}
.prep-finish p{font-size:15px;line-height:1.8;color:#416b82;margin:10px 0 0}
.prep-finish .btn{flex:none;min-height:52px}
html[dir=rtl] .prep-hero-art,html[dir=rtl] .prep-line{transform:scaleX(-1)}
html[dir=rtl] .prep-hero-art span{transform:scaleX(-1)}
@media(max-width:900px){
 .prep-hero{grid-template-columns:1fr;padding-block:42px 36px}
 .prep-hero-art{min-height:125px;max-width:580px;padding:16px}
 .prep-hero-art span{width:54px;height:54px}
 .prep-layout{grid-template-columns:1fr;gap:24px}
 .prep-index{position:static}
 .prep-index nav{grid-template-columns:repeat(2,minmax(0,1fr))}
 .prep-index-note{display:none}
}
@media(max-width:650px){
 .prep-hero{padding-block:29px 28px;gap:24px}
 .prep-hero h1{font-size:37px}
 .prep-hero p{font-size:16px;line-height:1.75;margin-top:14px}
 .prep-actions{gap:14px;margin-top:22px}
 .prep-actions .btn{width:100%;justify-content:center}
 .prep-hero-art{min-height:104px}
 .prep-hero-art span{width:46px;height:46px;border-radius:13px}
 .prep-hero-art svg{width:24px;height:24px}
 .prep-index{padding:20px}
 .prep-index nav{grid-template-columns:1fr 1fr;gap:2px 5px}
 .prep-index nav a{font-size:14px;padding:10px 4px;gap:7px}
 .prep-stage{border-radius:17px;margin-bottom:18px}
 .prep-stage-heading{padding:17px;gap:11px}
 .prep-stage-icon{width:40px;height:40px}
 .prep-stage h2{font-size:23px}
 .prep-rows{padding-inline:17px}
 .prep-row{gap:10px;padding:17px 0}
 .prep-row h3{font-size:17px}
 .prep-row p{font-size:15px;line-height:1.7}
 .prep-finish{display:block;padding:24px 20px;margin-bottom:26px}
 .prep-finish .btn{display:inline-flex;margin-top:20px}
}
