/* JeriKo | Roads & the person behind the portfolio */
.road-notes{background:radial-gradient(ellipse at 88% 5%,rgba(134,96,255,.19),transparent 38%),radial-gradient(ellipse at 8% 73%,rgba(39,202,181,.14),transparent 37%),#101529;color:#eff2ff;padding:clamp(72px,9vw,132px) 0;position:relative;overflow:hidden}
.road-notes .road-shell,.road-preview .road-shell{width:min(1180px,calc(100% - 48px));margin:0 auto}
.road-kicker{font:700 11px/1.4 'Space Grotesk',sans-serif;letter-spacing:.21em;text-transform:uppercase;color:#91ecd3}
.road-head{display:flex;justify-content:space-between;align-items:end;gap:36px;margin:20px 0 36px}
.road-head h2{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:clamp(2.8rem,7.5vw,6rem);line-height:1.04;letter-spacing:-.065em;max-width:850px;margin:0;color:#f8f8ff}
.road-head h2 em{font-family:'DM Serif Display',serif;font-weight:400;color:#b4a4ff;letter-spacing:-.045em}
.road-head p{max-width:250px;color:#b8c5db;line-height:1.7;margin:0 0 7px}
.road-photos{display:grid;grid-template-columns:1.17fr .83fr;gap:18px}
.road-photo{display:block;position:relative;overflow:hidden;background:#252d48;border:1px solid rgba(207,207,255,.17);border-radius:23px;color:#fff;cursor:zoom-in;padding:0;text-align:left;isolation:isolate}
.road-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(.93)}
.road-photo:hover img,.road-photo:focus-visible img{transform:scale(1.045);filter:saturate(1.06)}
.road-photo:focus-visible{outline:3px solid #9ef7e7;outline-offset:3px}
.road-photo:after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(5,9,25,.76));z-index:1;pointer-events:none}
.road-photo .road-caption{position:absolute;z-index:2;bottom:22px;left:25px;right:22px;display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:8px}
.road-caption b{font-size:clamp(1.08rem,2vw,1.7rem);letter-spacing:-.03em;line-height:1.13}
.road-caption small{display:block;font-size:.7rem;font-weight:600;letter-spacing:.13em;color:#bafce7;text-transform:uppercase;margin-bottom:8px}
.road-caption .road-zoom{font-size:1.3rem;border:1px solid rgba(255,255,255,.5);border-radius:50%;display:grid;place-items:center;width:36px;height:36px}
.road-photo--large{height:480px}.road-photo--large img{object-position:center 46%}
.road-photo--medium{height:480px}.road-photo--medium img{object-position:center 49%}
.road-storygrid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;margin:70px 0;align-items:start}
.road-storygrid h3{margin:12px 0 18px;font-size:clamp(2rem,4vw,3.6rem);line-height:1.08;letter-spacing:-.055em;color:#fff}
.road-storygrid h3 em{color:#93e9de;font-family:'DM Serif Display',serif;font-weight:400}
.road-storygrid p{color:#bfcae0;line-height:1.82;margin:0 0 17px;font-size:1.045rem}
.road-highlight{display:flex;align-items:center;gap:16px;border-top:1px solid rgba(210,210,255,.16);border-bottom:1px solid rgba(210,210,255,.16);padding:21px 0;margin-top:28px}
.road-highlight b{font:600 clamp(2.5rem,5vw,4.2rem)/1 'Space Grotesk',sans-serif;letter-spacing:-.07em;color:#aaf5e1}
.road-highlight span{font-size:.9rem;color:#d2dbeb;max-width:210px}
.road-destinations{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.road-destinations span{border:1px solid rgba(195,205,255,.23);border-radius:99px;padding:9px 13px;font-size:.8rem;color:#d4deee;background:rgba(255,255,255,.035)}
.road-storyline{padding-left:29px;border-left:1px solid #5a7184;display:grid;gap:22px}
.road-stop{position:relative}.road-stop:before{position:absolute;content:'';left:-36px;top:8px;height:13px;width:13px;background:#91e9d1;border:3px solid #101529;border-radius:50%;box-shadow:0 0 0 1px #91e9d1}
.road-stop small{font-size:11px;letter-spacing:.17em;color:#96ded8;font-weight:700}
.road-stop h4{margin:7px 0 5px;font-size:1.25rem;letter-spacing:-.03em;color:#fff}
.road-stop p{margin:0;font-size:.94rem}
.road-close{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.road-close .road-photo{height:315px}
.road-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.road-button{appearance:none;border:1px solid rgba(201,214,255,.4);background:transparent;color:#f5f5ff;border-radius:14px;padding:14px 18px;font:600 14px 'Space Grotesk',sans-serif;cursor:pointer;text-decoration:none;transition:transform .2s,background .2s}
.road-button:hover{transform:translateY(-2px);background:rgba(255,255,255,.08)}.road-button.primary{background:#a99aff;color:#11152c;border-color:#a99aff}
.road-button:focus-visible{outline:3px solid #8cebd3;outline-offset:3px}
.road-lightbox{border:none;padding:0;background:transparent;max-width:min(94vw,1200px);max-height:94dvh;color:#fff;box-shadow:0 0 0 100vmax rgba(2,5,14,.88)}
.road-lightbox::backdrop{background:rgba(2,5,14,.86)}
.road-lightbox img{max-width:94vw;max-height:83dvh;object-fit:contain;display:block;margin:auto;border-radius:8px}
.road-lightbox>div{text-align:center;padding:12px 60px;color:#d4d9ec;font:500 14px 'DM Sans',sans-serif}
.road-lightbox .road-lightbox-close{position:absolute;top:10px;right:10px;width:42px;height:42px;border:1px solid #ffffff70;background:#181b33d9;color:#fff;border-radius:50%;cursor:pointer;font-size:1.5rem;z-index:2}
.road-preview{background:#13172c;color:#f1f4ff;padding:78px 0;border-top:1px solid #ffffff18;border-bottom:1px solid #ffffff18}
.road-preview .road-mini{display:grid;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);align-items:stretch;gap:30px;min-height:390px}
.road-preview .road-mini-photo{border-radius:22px;overflow:hidden;position:relative;min-height:340px}
.road-preview img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center 43%}
.road-preview .road-mini-copy{align-self:center;padding:22px}
.road-preview h2{font:600 clamp(2.25rem,4.5vw,4.3rem)/1.1 'Space Grotesk',sans-serif;letter-spacing:-.055em;color:#fff;margin:14px 0}
.road-preview h2 em{font-family:'DM Serif Display',serif;font-weight:400;color:#ad9cff}
.road-preview p{font-size:1rem;line-height:1.75;color:#bdc9df;max-width:450px}
.road-preview .road-button{display:inline-flex;margin-top:10px}
@media(max-width:850px){.road-head{display:block}.road-head p{max-width:550px;margin-top:18px}.road-storygrid{grid-template-columns:1fr;gap:32px}.road-photo--large,.road-photo--medium{height:390px}.road-preview .road-mini{grid-template-columns:1fr}.road-preview .road-mini-photo{min-height:320px}}
@media(max-width:600px){.road-notes .road-shell,.road-preview .road-shell{width:min(100% - 30px,1180px)}.road-notes{padding:65px 0}.road-head{margin:15px 0 25px}.road-photos,.road-close{grid-template-columns:1fr;gap:13px}.road-photo--large{height:320px}.road-photo--medium{height:300px}.road-close .road-photo{height:270px}.road-caption b{font-size:1.3rem}.road-head h2{font-size:clamp(2.7rem,11vw,4rem)}.road-storygrid{margin:42px 0}.road-stop h4{font-size:1.1rem}.road-preview{padding:50px 0}.road-preview .road-mini-photo{min-height:260px}.road-preview .road-mini-copy{padding:5px}}
@media(prefers-reduced-motion:reduce){.road-photo img,.road-button{transition:none}}
