body.page-id-5926 .tj-entry-content{overflow:visible!important;} body.admin-bar.page-id-5926 #asi-history-feature .milestone-nav{top:102px;} @media(max-width:782px){body.admin-bar.page-id-5926 #asi-history-feature .milestone-nav{top:116px;}} #asi-history-feature *{box-sizing: border-box;} /* Keep the Bexon theme's generic timeline divider outside this History feature. */ #asi-history-feature .timeline::before, #asi-history-feature .timeline::after{content:none!important;display:none!important;border:0!important;background:none!important} #asi-history-feature{scroll-behavior: smooth; background: rgb(34, 36, 37);} #asi-history-feature{margin: 0px; color: rgb(237, 241, 237); font: 18px / 1.55 "PT Sans", Arial, sans-serif;} #asi-history-feature button,#asi-history-feature a{-webkit-tap-highlight-color: transparent;} #asi-history-feature button{font: inherit; cursor: pointer;} #asi-history-feature a{color: inherit;} #asi-history-feature button:focus-visible,#asi-history-feature a:focus-visible{outline: rgb(187, 217, 196) solid 3px; outline-offset: 6px;} #asi-history-feature .site-header{background: rgb(245, 245, 242); color: rgb(39, 59, 50); padding: 18px max(24px, -620px + 50vw); display: flex; align-items: center; justify-content: space-between; gap: 25px;} #asi-history-feature .site-header img{width: 134px; height: 56px; object-fit: contain;} #asi-history-feature .site-header nav{display: flex; gap: 30px; font-size: 16px;} #asi-history-feature .site-header a{text-decoration: none;} #asi-history-feature .site-header a:hover{text-decoration: underline; text-underline-offset: 5px;} #asi-history-feature .journey{position: relative; max-width: 1440px; margin: auto; padding: 0px 80px; background: radial-gradient(at 80% 0px, rgba(125, 163, 135, 0.1), transparent 30%);} #asi-history-feature .journey::before{content: ""; position: absolute; inset: 0px; pointer-events: none; background-image: linear-gradient(rgba(155, 184, 162, 0.027) 1px, transparent 1px), linear-gradient(90deg, rgba(155, 184, 162, 0.027) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(rgb(0, 0, 0), transparent 60%);} #asi-history-feature .intro{position: relative; z-index: 1; padding: 78px 0px 56px; max-width: 960px;} #asi-history-feature .eyebrow{font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: rgb(179, 205, 187); display: flex; gap: 10px; align-items: center; margin: 0px 0px 20px;} #asi-history-feature .eyebrow::before{content: ""; width: 9px; height: 9px; background: rgb(150, 186, 159); transform: rotate(45deg); flex-shrink: 0;} #asi-history-feature h1,#asi-history-feature h2,#asi-history-feature h3{font-family: "Squada One", Impact, sans-serif; font-weight: 400; line-height: 1.04; margin: 0px; overflow-wrap: break-word; color: rgb(237, 241, 237) !important;} #asi-history-feature h1{font-size: clamp(52px, 6.5vw, 88px); letter-spacing: 0.008em; max-width: 900px;} #asi-history-feature h1 span{color: rgb(167, 196, 175);} #asi-history-feature .intro .lead{font-size: 21px; line-height: 1.5; color: rgb(210, 217, 212); max-width: 655px; margin: 26px 0px 0px;} #asi-history-feature .reach-connections{margin-top: 26px; border-top: 1px solid rgb(74, 90, 78); padding-top: 20px; color: rgb(216, 228, 220);} #asi-history-feature .reach-connections p{margin: 0px 0px 18px; font-size: 18px; font-weight: 700;} #asi-history-feature .reach-stops{display: flex; gap: 12px; margin-bottom: 20px; border-top: 1px solid rgb(120, 153, 130);} #asi-history-feature .reach-stops span{position: relative; flex: 1 1 0%; padding-top: 13px; font-size: 14px; line-height: 1.4;} #asi-history-feature .reach-stops span::before{content: ""; position: absolute; top: -4px; left: 0px; width: 7px; height: 7px; border-radius: 50%; background: rgb(179, 205, 187);} #asi-history-feature .reach-connections a{font-size: 14px; text-decoration: underline; text-underline-offset: 5px;} #asi-history-feature .intro-foot{margin-top: 30px; display: flex; gap: 26px; align-items: center; font-size: 14px; color: rgb(179, 193, 183);} #asi-history-feature .intro-foot a{display: inline-flex; gap: 15px; align-items: center; text-decoration: none; color: rgb(238, 244, 240); border-bottom: 1px solid rgb(136, 168, 146); padding-bottom: 6px;} #asi-history-feature .intro-foot span{letter-spacing: 0.07em;} #asi-history-feature .milestone-nav{position: sticky; top: 70px; z-index: 10; background: rgba(34, 36, 37, 0.96); backdrop-filter: blur(14px); border-top: 1px solid rgb(70, 82, 73); border-bottom: 1px solid rgb(70, 82, 73); display: flex; align-items: center; gap: 15px; padding: 14px 0px; justify-content: space-between;} #asi-history-feature .milestone-nav .nav-label{color: rgb(182, 197, 186); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; margin-right: 15px;} #asi-history-feature .milestone-nav a{position: relative; display: flex; gap: 8px; align-items: center; text-decoration: none; white-space: nowrap; color: rgb(165, 179, 169); font-size: 14px; padding: 7px 10px; border-radius: 99px; transition: background 0.2s, color 0.2s;} #asi-history-feature .milestone-nav a::before{content: ""; width: 5px; height: 5px; border-radius: 50%; background: rgb(101, 125, 107);} #asi-history-feature .milestone-nav a[aria-current="step"]{background: rgb(129, 159, 137); color: rgb(23, 38, 29);} #asi-history-feature .milestone-nav a[aria-current="step"]::before{background: rgb(36, 57, 43);} #asi-history-feature .milestone-nav a:hover{background: rgb(60, 75, 64); color: rgb(255, 255, 255);} #asi-history-feature .timeline{position: relative; padding-top: 44px;} #asi-history-feature .route-svg{position: absolute; inset: 0px; width: 100%; height: 100%; pointer-events: none; overflow: visible;} #asi-history-feature .route-bed{fill: none; stroke: rgb(104, 129, 111); stroke-width: 38; stroke-linecap: round;} #asi-history-feature .route-surface{fill: none; stroke: rgb(42, 51, 46); stroke-width: 34; stroke-linecap: round;} #asi-history-feature .route-lanes{fill: none; stroke: rgb(166, 185, 172); stroke-width: 1.5; opacity: 0.7;} #asi-history-feature .route-progress{fill: none; stroke: rgb(160, 195, 170); stroke-width: 34; stroke-linecap: round; opacity: 0.1;} #asi-history-feature .road-car{position: absolute; left: 0px; top: 0px; width: 40px; height: 80px; z-index: 4; pointer-events: none; opacity: 0; will-change: transform;} #asi-history-feature .car-sprite{display: block; width: 100%; height: 100%; object-fit: contain; mask-repeat: no-repeat; mask-image: url("data:image/webp;base64,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"); mask-size: 100% 100%; filter: drop-shadow(rgba(0, 0, 0, 0.6) 0px 3px 4px);} #asi-history-feature .headlight{position: absolute; top: -61px; width: 31px; height: 70px; background: linear-gradient(to top, rgba(255, 248, 211, 0.6), rgba(255, 248, 211, 0)); clip-path: polygon(43% 100%, 57% 100%, 100% 0px, 0px 0px); opacity: 0; transition: opacity 0.3s; filter: blur(2px);} #asi-history-feature .headlight.left{left: -5px;} #asi-history-feature .headlight.right{right: -5px;} #asi-history-feature .headlights-on .headlight{opacity: 0.85;} #asi-history-feature .tire-smoke{position: absolute; bottom: -9px; width: 16px; height: 22px; border-radius: 50%; background: rgb(224, 227, 219); filter: blur(4px); opacity: 0;} #asi-history-feature .tire-smoke.left{left: -3px;} #asi-history-feature .tire-smoke.right{right: -3px;} #asi-history-feature .accelerating .tire-smoke{animation: 1.1s ease-out 0s 1 normal both running tire-puff;} #asi-history-feature .accelerating .tire-smoke.right{animation-delay: 0.08s;} @keyframes tire-puff { 0% { opacity: 0; transform: translateY(0px) scale(0.5); } 18% { opacity: 0.62; transform: translateY(8px) scale(1.2); } 55% { opacity: 0.3; } 100% { opacity: 0; transform: translateY(62px) scale(2.8); } } #asi-history-feature .road-tunnel{position: absolute; width: 115px; height: 100px; object-fit: contain; pointer-events: none; z-index: 5; opacity: 0.92;} #asi-history-feature .rail-crossing{position: absolute; width: 230px; height: 76px; overflow: hidden; pointer-events: none; z-index: 6;} #asi-history-feature .rail-track{position: absolute; inset: 29px 0px auto; height: 23px; background: linear-gradient(transparent 5px, rgb(154, 167, 157) 5px, rgb(154, 167, 157) 7px, transparent 7px, transparent 16px, rgb(154, 167, 157) 16px, rgb(154, 167, 157) 18px, transparent 18px), repeating-linear-gradient(90deg, transparent 0px, transparent 12px, rgb(89, 101, 92) 12px, rgb(89, 101, 92) 15px); opacity: 0.7; mask-image: linear-gradient(90deg, transparent, rgb(0, 0, 0) 15%, rgb(0, 0, 0) 85%, transparent);} #asi-history-feature .coastal-train{position: absolute; width: 210px; height: 26px; left: 0px; top: 19px; object-fit: contain; transform: translateX(-220px); opacity: 0;} #asi-history-feature .is-crossing .coastal-train{animation: 4s linear 1s 1 normal both running coastal-crossing;} @keyframes coastal-crossing { 0% { transform: translateX(-220px); opacity: 1; } 100% { transform: translateX(240px); opacity: 1; } } @media (max-width: 700px){#asi-history-feature .rail-crossing{width: 68px; height: 48px;} #asi-history-feature .rail-track{top: 17px; height: 19px;} #asi-history-feature .coastal-train{width: 100px; height: 36px; top: 2px;}} #asi-history-feature .milestone.copy-left .pin{translate: -28px;} #asi-history-feature .milestone.copy-right .pin{translate: 28px;} #asi-history-feature .milestone{position: relative; display: grid; grid-template-columns: minmax(0px, 1fr) 120px minmax(0px, 1fr); gap: 12px; align-items: center; min-height: 450px; padding: 44px 0px; scroll-margin-top: 92px;} #asi-history-feature .milestone .copy{grid-area: 1 / 1; padding-right: 30px; min-width: 0px;} #asi-history-feature .milestone .visual{grid-area: 1 / 3; min-width: 0px;} #asi-history-feature .milestone .pin{grid-area: 1 / 2; place-self: center; z-index: 2;} #asi-history-feature .milestone.copy-right .copy{grid-column: 3; padding-right: 0px; padding-left: 30px;} #asi-history-feature .milestone.copy-right .visual{grid-column: 1;} #asi-history-feature .date{display: flex; align-items: center; gap: 12px; margin: 0px 0px 15px; font-size: 15px; font-weight: 700; letter-spacing: 0.1em; color: rgb(167, 196, 175);} #asi-history-feature .date::after{content: ""; width: 36px; height: 1px; background: rgb(113, 142, 122);} #asi-history-feature .copy h2{font-size: clamp(34px, 3.6vw, 48px); max-width: 460px;} #asi-history-feature .copy p{color: rgb(200, 208, 202); font-size: 17px; line-height: 1.6; margin: 19px 0px 0px; max-width: 450px;} #asi-history-feature .copy .callout{margin-top: 22px; padding-left: 16px; border-left: 2px solid rgb(146, 181, 156); color: rgb(234, 242, 236); font-size: 15px; line-height: 1.4; font-weight: 700;} #asi-history-feature .copy a{display: inline-flex; gap: 14px; font-size: 14px; margin-top: 22px; color: rgb(189, 212, 197); text-underline-offset: 5px; text-decoration-thickness: 1px;} #asi-history-feature .pin{display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgb(148, 182, 158); border-radius: 50%; background: rgb(34, 36, 37); color: rgb(220, 235, 225); font-size: 12px; font-weight: 700; box-shadow: rgb(34, 36, 37) 0px 0px 0px 9px, rgb(60, 81, 67) 0px 0px 0px 10px; transition: background 0.25s, box-shadow 0.25s;} #asi-history-feature .milestone.is-active .pin{background: rgb(156, 189, 166); color: rgb(24, 36, 28); box-shadow: rgb(34, 36, 37) 0px 0px 0px 9px, rgb(107, 136, 116) 0px 0px 0px 10px, rgba(144, 183, 155, 0.12) 0px 0px 28px;} #asi-history-feature .visual{margin: 0px;} #asi-history-feature .frame{position: relative; display: block; width: 100%; padding: 8px; border: 1px solid rgb(130, 151, 136); border-radius: 16px; background: rgb(234, 240, 235); box-shadow: rgba(0, 0, 0, 0.18) 0px 18px 45px; transition: transform 0.3s, box-shadow 0.3s; overflow: hidden;} #asi-history-feature .frame img{display: block; width: 100%; height: 272px; object-fit: cover; border-radius: 10px; transition: transform 0.45s;} #asi-history-feature .frame.map img{object-fit: contain; height: auto; aspect-ratio: 8 / 5; background: rgb(29, 48, 49);} #asi-history-feature .frame.plan img{object-fit: contain; background: rgb(255, 255, 255);} @media (hover: hover){#asi-history-feature .frame:not(.story-art-frame):hover{transform: translateY(-4px) scale(1.04); box-shadow: rgba(0, 0, 0, 0.32) 0px 26px 54px;} #asi-history-feature .frame:not(.story-art-frame):hover img{transform: scale(1.025);}} #asi-history-feature .visual figcaption{display: flex; justify-content: space-between; gap: 16px; color: rgb(179, 194, 184); font-size: 12px; line-height: 1.4; margin-top: 15px; padding: 0px 3px;} #asi-history-feature .visual figcaption span:last-child{white-space: nowrap; color: rgb(141, 166, 150);} #asi-history-feature .two-frames{display: grid; grid-template-columns: 1fr 1fr; gap: 10px;} #asi-history-feature .two-frames .frame{padding: 6px; border-radius: 12px;} #asi-history-feature .two-frames .frame img{height: 235px; border-radius: 7px;} #asi-history-feature .team-portraits{display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 7px; background: rgb(234, 240, 235); padding: 9px; border-radius: 14px; border: 1px solid rgb(145, 170, 153); box-shadow: rgba(0, 0, 0, 0.18) 0px 18px 45px;} #asi-history-feature .team-portraits img{width: 100%; height: 165px; object-fit: cover; object-position: center top; border-radius: 7px; background: rgb(255, 255, 255);} #asi-history-feature .team-note{margin: 12px 2px; color: rgb(179, 194, 184); font-size: 12px;} #asi-history-feature .team-person{display: block; color: rgb(32, 51, 41); text-decoration: none; border-radius: 7px; transition: background 0.2s, transform 0.2s; min-width: 0px;} #asi-history-feature .team-person span{display: flex; align-items: start; justify-content: space-between; gap: 6px; font-size: 14px; line-height: 1.3; font-weight: 700; padding: 11px 3px 4px;} #asi-history-feature .team-person b{font-weight: 400; color: rgb(84, 114, 94);} #asi-history-feature .team-person:hover{background: rgb(213, 224, 216); transform: translateY(-3px);} #asi-history-feature #workplace .frame img,#asi-history-feature #markets .frame img,#asi-history-feature #licensed .frame img,#asi-history-feature #programs .frame img{height: auto; aspect-ratio: 3 / 2; object-fit: contain; background: rgb(34, 36, 37);} #asi-history-feature .bay-scene{position: relative; width: min(390px, 100%); aspect-ratio: 3 / 2; margin: 25px auto 0px; pointer-events: none; isolation: isolate;} #asi-history-feature .bay-water{display: block; width: 100%; height: 100%; object-fit: contain;} #asi-history-feature .bay-waiting{position: absolute; inset: 0px; width: 100%; height: 100%; clip-path: ellipse(11% 10% at 55.5% 34.5%);} #asi-history-feature .surf-part{position: absolute; width: 19%; height: auto; opacity: 0; transform-origin: center center; will-change: transform, opacity; pointer-events: none; z-index: 3;} #asi-history-feature .surf-part[data-surf-part="swell"],#asi-history-feature .surf-part[data-surf-part="break"]{z-index: 2; mask-image: radial-gradient(rgb(0, 0, 0) 42%, transparent 73%);} #asi-history-feature #foundation .frame img{aspect-ratio: 3 / 2; object-fit: contain; background: rgb(34, 36, 37);} #asi-history-feature .rail-gates{position: absolute; width: 230px; height: 76px; pointer-events: none; z-index: 7;} #asi-history-feature .rail-gate{position: absolute; width: 40px; height: 100px; left: 53px; top: -58px;} #asi-history-feature .rail-gate.second{left: 148px; top: 30px; transform: scaleX(-1);} #asi-history-feature .rail-gate .gate-post{width: 40px; height: 104px;} #asi-history-feature .rail-gate .gate-arm{position: absolute; width: 100px; max-width: none; height: auto; left: 21.2px; top: 61.6px; transform-origin: 6.3% 49.2%; transform: rotate(-80deg); transition: transform 0.8s ease-in-out;} #asi-history-feature .rail-gates.is-crossing .gate-arm{transform: rotate(0deg);} #asi-history-feature .rail-gates.is-crossing .gate-post{animation: 0.6s steps(2) 0s infinite normal none running gate-signal;} @keyframes gate-signal { 50% { filter: brightness(1.5); } } @media (max-width: 700px){#asi-history-feature .rail-gates{width: 68px; height: 48px;} #asi-history-feature .rail-gate{left: 4px; top: -39px; transform: scale(0.55); transform-origin: left top;} #asi-history-feature .rail-gate.second{left: 62px; top: 23px; transform: scale(-0.55, 0.55);}} @media (prefers-reduced-motion: reduce){#asi-history-feature:not([data-motion="active"]) .rail-gates .gate-arm{transition: none;} #asi-history-feature:not([data-motion="active"]) .rail-gates.is-crossing .gate-post{animation: auto ease 0s 1 normal none running none;}} #asi-history-feature #today{padding-bottom: 12px;} #asi-history-feature #next{padding-top: 28px;} @media (max-width: 700px){#asi-history-feature #next .pin{position: relative; left: -61px;}} #asi-history-feature .roadside{position: absolute; pointer-events: none; z-index: 1; object-fit: contain;} #asi-history-feature .coast{width: 210px; height: 140px; left: calc(50% - 265px); top: -3px; opacity: 0.83;} #asi-history-feature .surfer-scene{width: 137px; height: 91px; left: calc(50% - 174px); bottom: -41px; opacity: 0.83;} @media (max-width: 700px){#asi-history-feature .surfer-scene{display: none;}} #asi-history-feature .palm-start{width: 65px; height: 88px; left: calc(50% - 114px); top: 5px; opacity: 0.62; filter: saturate(0.45);} #asi-history-feature .palm-later{width: 62px; height: 83px; left: calc(50% + 40px); bottom: -31px; opacity: 0.55; filter: saturate(0.45);} #asi-history-feature .palm-companion{width: 47px; height: 67px; left: calc(50% + 79px); bottom: -26px; opacity: 0.48; filter: saturate(0.45); transform: scaleX(-1);} #asi-history-feature .palm-pair-left{left: calc(50% - 115px);} @media (max-width: 1050px){#asi-history-feature .palm-companion{width: 35px; height: 50px; left: calc(50% + 45px);}} @media (max-width: 700px){#asi-history-feature .palm-companion{display: none;}} #asi-history-feature .license-links{display: flex; flex-wrap: wrap; gap: 5px 8px; align-items: baseline;} #asi-history-feature .copy .license-links a{font-size: 14px; margin: 0px; display: inline; color: rgb(234, 242, 236); text-decoration: underline rgb(130, 159, 140); text-underline-offset: 4px;} #asi-history-feature .license-proof{display: flex; align-items: center; gap: 18px; margin-top: 20px; flex-wrap: wrap;} #asi-history-feature .certificate{display: block; width: 100%; max-width: 390px; background: rgb(236, 240, 235); border: 1px solid rgb(167, 186, 171); border-radius: 12px; padding: 9px; color: rgb(40, 63, 48); text-align: left; font-size: 13px; box-shadow: rgba(0, 0, 0, 0.133) 0px 10px 30px; transition: transform 0.2s, box-shadow 0.2s;} #asi-history-feature .certificate-window{display: block; position: relative; width: 100%; aspect-ratio: 500 / 245; overflow: hidden; border: 1px solid rgb(211, 220, 212); border-radius: 6px; background: rgb(255, 255, 255);} #asi-history-feature .certificate .certificate-window img{position: absolute; width: 199.4%; max-width: none; height: auto; left: -50%; top: -142.857%; object-fit: initial; opacity: 1;} #asi-history-feature .certificate-caption{display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 5px 2px;} #asi-history-feature .certificate b{font-weight: 400; font-size: 20px;} #asi-history-feature .certificate:hover{transform: translateY(-2px); box-shadow: rgba(0, 0, 0, 0.2) 0px 15px 36px;} #asi-history-feature .copy .license-proof > a{font-size: 13px; margin: 0px;} #asi-history-feature .classification-panel{display: grid; grid-template-columns: 1fr 1fr; border: 1px solid rgba(174, 199, 183, 0.24); border-radius: 10px; margin-top: 23px; background: rgba(159, 186, 167, 0.035); overflow: hidden;} #asi-history-feature .copy .classification-panel a{display: flex; flex-direction: column; gap: 5px; padding: 12px 15px; margin: 0px; font-size: 14px; text-decoration: none; transition: background 0.2s;} #asi-history-feature .classification-panel a:nth-child(2n+1){border-right: 1px solid rgba(174, 199, 183, 0.16);} #asi-history-feature .classification-panel a:nth-child(-n+2){border-bottom: 1px solid rgba(174, 199, 183, 0.16);} #asi-history-feature .classification-panel strong{font-family: "Squada One", Impact, sans-serif; font-size: 23px; font-weight: 400; color: rgb(182, 208, 191); line-height: 1;} #asi-history-feature .classification-panel span{font-size: 12px; line-height: 1.25; color: rgb(209, 221, 213);} #asi-history-feature .classification-panel a:hover{background: rgba(159, 186, 167, 0.13);} #asi-history-feature .credential-card{margin-top: 25px; padding: 19px 21px 17px; border: 7px solid rgb(201, 213, 203); outline: rgb(157, 180, 164) solid 1px; border-radius: 12px; background: rgb(245, 246, 241); color: rgb(35, 55, 43); box-shadow: rgba(0, 0, 0, 0.2) 0px 14px 35px; max-width: 450px;} #asi-history-feature .credential-heading{display: flex; align-items: center; justify-content: space-between; gap: 15px; padding-bottom: 13px; border-bottom: 1px solid rgb(200, 211, 200);} #asi-history-feature .credential-heading img{width: 91px; height: 38px; object-fit: contain;} #asi-history-feature .credential-heading > span{font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 700; text-align: right; max-width: 145px; color: rgb(88, 112, 94);} #asi-history-feature .copy .credential-number{font-size: 14px; color: rgb(83, 107, 89); margin: 14px 0px 0px; display: flex; align-items: baseline; gap: 10px;} #asi-history-feature .credential-number strong{font-family: "Squada One", Impact, sans-serif; font-weight: 400; font-size: 31px; letter-spacing: 0.025em; color: rgb(36, 61, 43);} #asi-history-feature .credential-card .classification-panel{margin-top: 11px; border: 0px; background: none; border-radius: 0px;} #asi-history-feature .copy .credential-card .classification-panel a{padding: 11px 0px 12px; gap: 4px;} #asi-history-feature .credential-card .classification-panel a:nth-child(2n){padding-left: 16px;} #asi-history-feature .credential-card .classification-panel a:nth-child(2n+1){border-color: rgb(200, 211, 200);} #asi-history-feature .credential-card .classification-panel a:nth-child(-n+2){border-color: rgb(200, 211, 200);} #asi-history-feature .credential-card .classification-panel strong{color: rgb(56, 91, 66); font-size: 24px;} #asi-history-feature .credential-card .classification-panel span{color: rgb(78, 100, 84); font-size: 13px;} #asi-history-feature .credential-card .classification-panel a:hover{background: rgb(226, 233, 223);} #asi-history-feature .credential-footer{display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid rgb(200, 211, 200); margin-top: 6px; padding-top: 12px; font-size: 12px; color: rgb(83, 107, 89); line-height: 1.45;} #asi-history-feature .credential-footer strong{font-weight: 700; color: rgb(46, 72, 54); font-size: 13px;} #asi-history-feature .copy .credential-footer a{display: inline-flex; font-size: 12px; margin: 0px; gap: 6px; color: rgb(53, 93, 67); text-underline-offset: 4px;} @media (max-width: 700px){#asi-history-feature .credential-card{padding: 15px 13px; border-width: 5px;} #asi-history-feature .credential-heading{gap: 10px;} #asi-history-feature .credential-heading img{width: 72px; height: 31px;} #asi-history-feature .credential-heading > span{font-size: 11px;} #asi-history-feature .credential-footer{align-items: flex-start;} #asi-history-feature .copy .credential-footer a{max-width: 108px;} #asi-history-feature .credential-card .classification-panel a:nth-child(2n){padding-left: 11px;}} #asi-history-feature .next-stop{position: relative; text-align: center; max-width: 680px; margin: auto; padding: 65px 0px 72px;} #asi-history-feature .next-stop .pin{margin: 0px auto 34px; width: 52px; height: 52px; background: rgb(161, 193, 171); color: rgb(25, 38, 30); font-size: 22px;} #asi-history-feature .next-stop .eyebrow{justify-content: center; margin-bottom: 14px;} #asi-history-feature .next-stop h2{font-size: 56px;} #asi-history-feature .next-stop p{max-width: 500px; margin: 20px auto 25px; color: rgb(200, 208, 202); font-size: 18px;} #asi-history-feature .next-stop.has-scene{max-width: none;} #asi-history-feature .next-content{display: grid; grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 0.85fr); gap: 60px; align-items: center; text-align: left; max-width: 1120px; margin: auto;} #asi-history-feature .next-copy .eyebrow{justify-content: flex-start; margin: 0px 0px 15px; font-size: 14px;} #asi-history-feature .next-copy p{margin: 20px 0px 25px;} #asi-history-feature .next-visual{margin: 0px;} #asi-history-feature .next-visual .frame{padding: 6px; background: rgba(151, 184, 162, 0.1); border-color: rgba(163, 193, 173, 0.35);} #asi-history-feature .next-visual img{height: auto; aspect-ratio: 2 / 1; object-fit: contain; background: rgb(34, 36, 37);} @media (max-width: 700px){#asi-history-feature .next-content{display: flex; flex-direction: column; gap: 29px; align-items: stretch;} #asi-history-feature .next-copy .eyebrow{font-size: 12px;} #asi-history-feature .next-visual{order: 2;}} #asi-history-feature .cta{display: inline-flex; align-items: center; gap: 27px; background: rgb(150, 180, 159); color: rgb(24, 38, 28); border-radius: 99px; padding: 14px 23px; text-decoration: none; font-weight: 700; font-size: 16px;} #asi-history-feature .endnote{border-top: 1px solid rgb(70, 82, 73); padding: 24px 0px 35px; display: flex; justify-content: space-between; gap: 25px; color: rgb(165, 184, 172); font-size: 13px;} #asi-history-feature .endnote a{text-underline-offset: 4px;} @media (max-width: 1050px){#asi-history-feature .journey{padding: 0px 36px;} #asi-history-feature .milestone{grid-template-columns: minmax(0px, 1fr) 80px minmax(0px, 1fr);} #asi-history-feature .milestone .copy{padding-right: 8px;} #asi-history-feature .milestone.copy-right .copy{padding-left: 8px;} #asi-history-feature .frame img{height: 230px;} #asi-history-feature .team-portraits{grid-template-columns: repeat(2, minmax(0px, 1fr));} #asi-history-feature .team-portraits img{height: 160px;} #asi-history-feature .nav-label{display: none;}} @media (max-width: 700px){#asi-history-feature .site-header{padding: 13px 20px;} #asi-history-feature .site-header img{width: 110px; height: 42px;} #asi-history-feature .site-header nav{font-size: 13px; gap: 18px;} #asi-history-feature .site-header nav a:nth-child(2){display: none;} #asi-history-feature .journey{padding: 0px 20px;} #asi-history-feature .intro{padding: 46px 0px 34px;} #asi-history-feature .intro h1{font-size: 52px;} #asi-history-feature .intro .lead{font-size: 18px; margin-top: 23px;} #asi-history-feature .intro-foot{font-size: 12px; gap: 18px;} #asi-history-feature .milestone-nav{gap: 0px; padding: 10px 0px; overflow: auto; justify-content: flex-start; scrollbar-width: none;} #asi-history-feature .milestone-nav a{font-size: 12px; padding: 7px 11px; gap: 6px;} #asi-history-feature .timeline{padding-top: 13px;} #asi-history-feature .milestone{grid-template-columns: 40px minmax(0px, 1fr); gap: 0px 21px; padding: 32px 0px 38px; min-height: 0px; align-items: start;} #asi-history-feature .milestone .copy,#asi-history-feature .milestone.copy-right .copy{grid-area: 1 / 2; padding: 0px;} #asi-history-feature .milestone .visual,#asi-history-feature .milestone.copy-right .visual{grid-area: 2 / 2; margin-top: 25px;} #asi-history-feature .milestone .pin{grid-area: 1 / 1; align-self: start; margin-top: 12px; width: 32px; height: 32px; box-shadow: rgb(34, 36, 37) 0px 0px 0px 5px, rgb(60, 81, 67) 0px 0px 0px 6px; font-size: 10px;} #asi-history-feature .milestone.is-active .pin{box-shadow: rgb(34, 36, 37) 0px 0px 0px 5px, rgb(121, 150, 131) 0px 0px 0px 6px;} #asi-history-feature .date{font-size: 13px; letter-spacing: 0.08em; margin-bottom: 12px;} #asi-history-feature .copy h2{font-size: 35px;} #asi-history-feature .copy p{font-size: 16px; margin-top: 16px;} #asi-history-feature .copy .callout{font-size: 14px; margin-top: 18px; padding-left: 12px;} #asi-history-feature .frame{padding: 6px; border-radius: 12px;} #asi-history-feature .frame img{height: 205px; border-radius: 7px;} #asi-history-feature .visual figcaption{font-size: 11px; margin-top: 12px;} #asi-history-feature .visual figcaption span:last-child{display: none;} #asi-history-feature .two-frames{gap: 8px;} #asi-history-feature .two-frames .frame img{height: 185px;} #asi-history-feature .team-portraits img{height: 140px;} #asi-history-feature .next-stop{margin: 0px 0px 0px 61px; padding: 36px 0px 52px; text-align: left;} #asi-history-feature .next-stop .pin{margin: 0px 0px 30px; width: 40px; height: 40px;} #asi-history-feature .next-stop .eyebrow{justify-content: flex-start; font-size: 11px;} #asi-history-feature .next-stop h2{font-size: 42px;} #asi-history-feature .next-stop p{font-size: 16px;} #asi-history-feature .cta{font-size: 15px; padding: 12px 20px; gap: 20px;} #asi-history-feature .endnote{font-size: 11px; gap: 16px; align-items: start;} } @media (max-width: 700px){#asi-history-feature .milestone.copy-left .pin,#asi-history-feature .milestone.copy-right .pin{translate: 0px;} #asi-history-feature .route-bed{stroke-width: 30;} #asi-history-feature .route-surface,#asi-history-feature .route-progress{stroke-width: 26;} #asi-history-feature .road-car{width: 32px; height: 64px;} #asi-history-feature .road-tunnel{width: 65px; height: 57px;}} #asi-history-feature .milestone .pin{width: 24px; height: 24px; color: transparent; font-size: 0px; border: 1px solid rgba(192, 214, 200, 0.52); background: rgba(159, 188, 169, 0.12); box-shadow: rgba(167, 196, 175, 0.043) 0px 0px 0px 5px; backdrop-filter: blur(4px);} #asi-history-feature .milestone.is-active .pin{color: transparent; background: rgba(172, 208, 183, 0.32); box-shadow: rgba(167, 196, 175, 0.09) 0px 0px 0px 6px; border-color: rgb(166, 199, 176);} @media (max-width: 700px){#asi-history-feature .milestone .pin{width: 19px; height: 19px; margin-top: 17px;} #asi-history-feature .milestone.is-active .pin{box-shadow: rgba(167, 196, 175, 0.08) 0px 0px 0px 4px;} #asi-history-feature .coast,#asi-history-feature .palm-start{display: none;} #asi-history-feature .palm-later{left: 0px; width: 35px; height: 47px; bottom: 14px; opacity: 0.4;} #asi-history-feature .license-proof{gap: 15px;} #asi-history-feature .team-person span{font-size: 13px;}} @media (prefers-reduced-motion: reduce){#asi-history-feature:not([data-motion="active"]){scroll-behavior: auto;} #asi-history-feature:not([data-motion="active"]) *,#asi-history-feature:not([data-motion="active"]) ::before,#asi-history-feature:not([data-motion="active"]) ::after{transition: none !important; animation: auto ease 0s 1 normal none running none !important;} #asi-history-feature:not([data-motion="active"]) .frame:hover,#asi-history-feature:not([data-motion="active"]) .frame:hover img{transform: none;} #asi-history-feature:not([data-motion="active"]) .route-progress{stroke-dashoffset: 0 !important;} #asi-history-feature:not([data-motion="active"]) .tire-smoke,#asi-history-feature:not([data-motion="active"]) .headlight{display: none;} #asi-history-feature:not([data-motion="active"]) .coastal-train{transform: translateX(-140px); opacity: 0.7;}} @media (max-width: 700px){#asi-history-feature .next-visual .frame img{height: auto; aspect-ratio: 2 / 1;}} @media (max-width: 700px) and (prefers-reduced-motion: reduce){#asi-history-feature:not([data-motion="active"]) .coastal-train{transform: translateX(-45px);}} #asi-history-feature .award-visual{max-width: 470px; justify-self: center; width: 100%;} #asi-history-feature .award-frame{display: block; padding: 10px; background: rgb(241, 241, 232); border: 7px solid rgb(82, 107, 92); border-radius: 8px; box-shadow: rgba(0, 0, 0, 0.2) 0px 14px 35px; transition: transform 0.25s;} #asi-history-feature .award-frame:hover{transform: translateY(-3px);} #asi-history-feature .award-frame img{display: block; width: 100%; height: auto;} #asi-history-feature .award-visual figcaption{display: flex; justify-content: space-between; gap: 14px; font-size: 13px; color: rgb(199, 214, 205); margin-top: 14px;} #asi-history-feature .award-visual figcaption a{text-underline-offset: 4px;} @media (prefers-reduced-motion: reduce){#asi-history-feature:not([data-motion="active"]) .award-frame:hover{transform: none;}} #asi-history-feature .ballpark-scene{position: relative; width: min(330px, 100%); aspect-ratio: 3 / 2; margin: 24px auto 0px; isolation: isolate; pointer-events: none;} #asi-history-feature .ballpark-scene > img{display: block; width: 100%; height: 100%; object-fit: contain;} #asi-history-feature .ballpark-scene > .crowd-standing{position: absolute; inset: 0px; opacity: 0; transition: opacity 0.25s;} #asi-history-feature .home-run > .crowd-standing{animation: 3.5s ease 1.05s 1 normal both running stand-and-cheer;} @keyframes stand-and-cheer { 0% { opacity: 0; } 12%, 82% { opacity: 1; } 100% { opacity: 0; } } #asi-history-feature .ballpark-motion{position: absolute; inset: 0px; width: 100%; height: 100%; overflow: visible;} #asi-history-feature .home-run-ball,#asi-history-feature .crowd-cheer{opacity: 0;} #asi-history-feature .ball-trail{fill: none; stroke: rgb(240, 221, 182); stroke-width: 3; opacity: 0;} #asi-history-feature .home-run-call{position: absolute; left: 50%; bottom: -8px; transform: translate(-50%, 5px); opacity: 0; font-size: 14px; font-weight: 700; letter-spacing: 0.04em; white-space: nowrap; color: rgb(228, 213, 183);} #asi-history-feature .home-run .ball-trail{animation: 1.8s ease-out 0s 1 normal both running ball-trail;} #asi-history-feature .home-run .crowd-cheer{animation: 1.5s ease-out 1.05s 1 normal both running crowd-cheer; transform-box: fill-box; transform-origin: center center;} #asi-history-feature .home-run .home-run-call{animation: 2.4s ease-out 0.9s 1 normal both running home-run-call;} @keyframes ball-trail { 0%, 6% { opacity: 0; } 35% { opacity: 0.55; } 100% { opacity: 0; } } @keyframes crowd-cheer { 0% { opacity: 0; transform: translateY(0px) scale(0.95); } 25% { opacity: 0.85; } 65% { opacity: 0.5; } 100% { opacity: 0; transform: translateY(-45px) scale(1.03); } } @keyframes home-run-call { 0% { opacity: 0; transform: translate(-50%, 5px); } 20%, 70% { opacity: 1; transform: translate(-50%, 0px); } 100% { opacity: 0; transform: translate(-50%, -3px); } } #asi-history-feature .ballpark-scene{width: min(440px, 100%); aspect-ratio: 1 / 1; margin: 26px auto 0px; border-radius: 20px; overflow: hidden;} #asi-history-feature .ballpark-scene > img{width: 100%; height: auto;} #asi-history-feature .home-run > .crowd-standing{animation: 10.6s ease 0.65s 1 normal both running stand-and-cheer;} #asi-history-feature .ballpark-scene > .baseball-batter{position: absolute; width: 8%; height: auto; left: 48.6%; top: 69.5%; clip-path: polygon(43% 13%, 74% 72%, 72% 78%, 66% 80%, 57% 67%, 45% 82%, 42% 86%, 35% 87%, 34% 82%, 44% 60%, 44% 43%, 50% 37%, 49% 29%, 56% 28%, 47% 19%); transform-origin: 55% 78%;} #asi-history-feature .home-run > .baseball-batter{animation: 0.9s ease 0s 1 normal both running bat-swing;} @keyframes bat-swing { 0%, 20% { opacity: 1; transform: rotate(0deg); } 55% { opacity: 1; transform: rotate(-28deg); } 80%, 100% { opacity: 0; transform: rotate(-28deg); } } #asi-history-feature .base-runner{position: absolute; width: 9%; aspect-ratio: 1 / 1; opacity: 0; z-index: 3; pointer-events: none;} #asi-history-feature .base-runner img{position: absolute; inset: 0px; width: 100%; height: 100%; opacity: 0; clip-path: polygon(20% 51%, 32% 51%, 40% 47%, 43% 40%, 34% 41%, 32% 36%, 37% 27%, 45% 24%, 52% 25%, 52% 19%, 55% 15%, 63% 15%, 67% 20%, 64% 24%, 65% 29%, 72% 32%, 74% 39%, 68% 43%, 63% 43%, 59% 39%, 59% 48%, 66% 58%, 70% 66%, 78% 66%, 79% 70%, 71% 76%, 66% 75%, 59% 62%, 51% 57%, 44% 56%, 35% 58%, 28% 57%, 26% 65%, 21% 66%, 20% 59%);} #asi-history-feature .base-runner img:nth-child(2){clip-path: polygon(40% 35%, 41% 29%, 48% 25%, 52% 24%, 52% 19%, 55% 15%, 62% 15%, 67% 20%, 63% 24%, 63% 28%, 66% 33%, 72% 34%, 75% 40%, 68% 45%, 61% 45%, 57% 51%, 61% 56%, 60% 61%, 56% 65%, 54% 75%, 61% 77%, 62% 80%, 55% 80%, 51% 77%, 51% 69%, 47% 66%, 44% 68%, 40% 66%, 39% 60%, 39% 53%, 44% 50%, 46% 43%, 43% 44%, 39% 43%, 37% 40%);} #asi-history-feature .base-runner img:nth-child(3){clip-path: polygon(20% 54%, 25% 52%, 33% 52%, 43% 47%, 45% 41%, 40% 39%, 37% 40%, 35% 39%, 33% 36%, 38% 29%, 46% 26%, 51% 26%, 53% 21%, 53% 18%, 57% 15%, 63% 16%, 68% 21%, 63% 24%, 63% 29%, 69% 34%, 73% 34%, 74% 31%, 78% 33%, 78% 38%, 71% 41%, 64% 43%, 59% 47%, 61% 54%, 66% 61%, 70% 67%, 77% 66%, 80% 69%, 76% 72%, 70% 76%, 66% 74%, 59% 62%, 53% 57%, 47% 56%, 38% 58%, 28% 56%, 25% 65%, 21% 65%, 20% 60%);} #asi-history-feature .home-run .home-run-call{animation: 10s ease 0.8s 1 normal both running home-run-call;} @media (max-width: 700px){#asi-history-feature .ballpark-scene{width: 100%;}} @media (prefers-reduced-motion: reduce){#asi-history-feature:not([data-motion="active"]) .base-runner{display: none;}} #asi-history-feature .ballpark-scene .home-run-call{bottom: 8px; padding: 3px 9px; border-radius: 6px; background: rgba(34, 36, 37, 0.91);} #asi-history-feature .baseball-transition{width: 44%; margin: 0px 0px 44px auto;} #asi-history-feature .baseball-transition .ballpark-scene{margin: 0px auto;} @media (max-width: 700px){#asi-history-feature .baseball-transition{width: calc(100% - 61px); margin: 0px 0px 36px 61px;}} /* Targeted additions. All selectors stay inside the existing feature. */ #asi-history-feature{overflow:visible} #asi-history-feature .journey{isolation:isolate} #asi-history-feature .road-car{z-index:8} #asi-history-feature .visual figcaption span:last-child{white-space:normal;display:inline;color:#b3c2b8} #asi-history-feature .motion-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:28px;font-size:13px;color:#b8c9be} #asi-history-feature .motion-controls button,#asi-history-feature [data-replay]{border:1px solid #738d7b;background:#2c3831;color:#eaf0eb;border-radius:99px;padding:10px 16px;min-height:44px;line-height:1.25;font:inherit;cursor:pointer} #asi-history-feature .motion-controls span{flex-basis:100%} #asi-history-feature .feature-stop{position:relative;width:44%;margin:12px 0 64px auto;scroll-margin-top:120px} #asi-history-feature .surf-transition{margin-left:0;margin-right:auto} #asi-history-feature .scene-panel{width:100%;max-width:480px;margin:auto} #asi-history-feature .feature-stop .eyebrow{font-size:11px;margin-bottom:18px;line-height:1.5} #asi-history-feature .bay-scene{width:100%;max-width:480px;margin:0;filter:saturate(.58)} #asi-history-feature .bay-waiting{will-change:transform;z-index:1} #asi-history-feature .scene-footer{border-top:1px solid #4a5a4e;margin-top:22px;padding-top:16px;display:flex;align-items:center;gap:14px;justify-content:space-between;color:#c2d0c6;font-size:13px;line-height:1.5} #asi-history-feature .scene-footer>span{max-width:220px} #asi-history-feature [data-replay]{font-size:12px;flex-shrink:0;padding:10px 13px} #asi-history-feature .ballpark-scene{filter:saturate(.55)} #asi-history-feature .construction-transition{width:44%;margin-left:0;margin-right:auto} #asi-history-feature .workplace-build{display:block;width:100%;height:auto;overflow:visible} #asi-history-feature .build-caption{display:flex;flex-direction:column;gap:8px;min-height:72px} #asi-history-feature .build-caption h3{font-size:29px;line-height:1.14} #asi-history-feature .build-stage{font-size:13px;color:#becfc2} #asi-history-feature .build-progress{height:2px;background:#435348;margin-top:16px} #asi-history-feature .build-progress span{display:block;width:0;height:100%;background:#b7c9b9} #asi-history-feature .team-portraits{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:18px} #asi-history-feature .team-portraits img{height:auto;aspect-ratio:4/5;object-fit:cover} #asi-history-feature .team-person span{position:relative;display:flex;flex-direction:column;padding:12px 22px 6px 2px;gap:5px;line-height:1.35} #asi-history-feature .team-person strong{font-size:17px;font-weight:700;color:#233c2d;overflow-wrap:normal} #asi-history-feature .team-person small{font-size:14px;font-weight:400;color:#425d4a;line-height:1.4} #asi-history-feature .team-person b{position:absolute;right:2px;top:12px} #asi-history-feature .team-note{font-size:14px;line-height:1.5;margin:18px 0} #asi-history-feature .team-action{display:inline-flex;gap:16px;align-items:center;min-height:46px;padding:11px 18px;border-radius:99px;background:#a9c0af;color:#1e3326;font-size:15px;font-weight:700;text-decoration:none} #asi-history-feature .credential-card{border-radius:10px;box-shadow:0 0 0 1px #4d6354,0 18px 36px #0002} #asi-history-feature .credential-card .classification-panel span{font-size:14px;line-height:1.4} #asi-history-feature .copy .credential-footer a{font-size:13px;line-height:1.5;min-height:44px;align-items:center} #asi-history-feature .credential-footer{flex-wrap:wrap;font-size:12px} #asi-history-feature .award-frame{border:7px solid #bbc9bf;border-radius:10px;padding:7px;background:#f5f6f1;transform:none} #asi-history-feature .award-frame img{display:block;width:100%;height:auto} #asi-history-feature .contact-illustration:hover{transform:translateY(-3px)} #asi-history-feature .rail-crossing.is-crossing .coastal-train{animation-delay:.8s} #asi-history-feature .rail-gates.is-crossing .gate-post{animation:none;filter:brightness(1.14)} #asi-history-feature .road-tunnel{z-index:5} #asi-history-feature[data-motion="paused"] *,#asi-history-feature[data-motion="paused"] *::before,#asi-history-feature[data-motion="paused"] *::after{animation-play-state:paused!important;transition:none!important} #asi-history-feature .milestone-nav a{min-height:44px} @media(min-width:1600px){#asi-history-feature .journey{max-width:1600px;padding:0 100px}#asi-history-feature .copy p{max-width:510px;font-size:18px}#asi-history-feature .copy h2{font-size:52px}#asi-history-feature .scene-panel{max-width:500px}} @media(max-width:1050px) and (min-width:701px){#asi-history-feature .scene-footer{flex-wrap:wrap}#asi-history-feature .team-portraits{padding:12px;gap:12px}#asi-history-feature .team-person strong{font-size:16px}#asi-history-feature .team-person small{font-size:13px}} @media(max-width:700px){ #asi-history-feature .feature-stop,#asi-history-feature .construction-transition,#asi-history-feature .surf-transition{width:calc(100% - 61px);margin:5px 0 50px 61px} #asi-history-feature .scene-footer{flex-direction:column;align-items:flex-start;gap:12px} #asi-history-feature .scene-footer>span{max-width:none} #asi-history-feature .feature-stop .eyebrow{font-size:10px;letter-spacing:.1em} #asi-history-feature .build-caption h3{font-size:27px} #asi-history-feature .team-portraits{padding:12px;gap:14px;grid-template-columns:1fr} #asi-history-feature .team-person{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:center} #asi-history-feature .team-person span{padding:5px 14px 5px 0} #asi-history-feature .team-person strong{font-size:16px} #asi-history-feature .team-person small{font-size:13px} #asi-history-feature .team-person img{height:100px;aspect-ratio:4/5} #asi-history-feature .team-action{font-size:14px;padding:11px 14px;gap:9px} #asi-history-feature .intro h1{font-size:clamp(40px,11vw,52px)} #asi-history-feature .milestone-nav .nav-label{display:none} #asi-history-feature .motion-controls{font-size:12px} #asi-history-feature .road-car{width:32px;height:64px} #asi-history-feature .visual figcaption{font-size:12px} #asi-history-feature .credential-card .classification-panel strong{font-size:22px} #asi-history-feature .credential-card .classification-panel span{font-size:13px} } @media(max-width:360px){#asi-history-feature .journey{padding:0 14px}#asi-history-feature .team-person{grid-template-columns:64px 1fr;gap:8px}#asi-history-feature .team-person img{height:80px}#asi-history-feature .credential-card{padding:13px 10px}} @media(prefers-reduced-motion:reduce){#asi-history-feature:not([data-motion="active"]) *,#asi-history-feature:not([data-motion="active"]) *::before,#asi-history-feature:not([data-motion="active"]) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}} #asi-history-feature .milestone .copy,#asi-history-feature .milestone .visual,#asi-history-feature .feature-stop .scene-panel{position:relative;z-index:9} #asi-history-feature .construction-milestone-visual{align-self:center} #asi-history-feature .construction-milestone-visual .construction-transition{width:100%;margin:0;scroll-margin-top:0} #asi-history-feature .construction-milestone-visual .scene-panel{max-width:560px;padding:24px;border:1px solid rgba(169,192,175,.28);border-radius:18px;background:linear-gradient(155deg,rgba(169,192,175,.075),rgba(22,30,26,.5));box-shadow:0 22px 52px rgba(0,0,0,.2)} #asi-history-feature .construction-milestone-visual .eyebrow{margin-bottom:10px} #asi-history-feature .construction-milestone-visual .workplace-build{margin-top:2px} #asi-history-feature .scene-footer{justify-content:flex-end} #asi-history-feature .scene-footer button{margin-left:auto} #asi-history-feature #founded{padding-bottom:78px} #asi-history-feature #surfing{margin-top:54px;margin-bottom:92px} #asi-history-feature .rail-crossing,#asi-history-feature .rail-gates{transform:scale(.48);transform-origin:center center} #asi-history-feature .team-person{background:#f7f8f3;border:1px solid #cbd8ce;overflow:hidden;box-shadow:0 7px 18px rgba(28,45,35,.08)} #asi-history-feature .team-person img{border-radius:6px 6px 0 0} #asi-history-feature .team-person span{min-height:78px;padding:12px 28px 10px 10px} #asi-history-feature .team-person b{right:10px} #asi-history-feature .team-person:focus-visible{outline:#355743 solid 3px;outline-offset:4px} @media(max-width:700px){ #asi-history-feature .construction-milestone-visual .construction-transition{width:100%;margin:0} #asi-history-feature .construction-milestone-visual .scene-panel{padding:16px 12px;border-radius:14px} #asi-history-feature #founded{padding-bottom:52px} #asi-history-feature #surfing{margin-top:34px;margin-bottom:64px} #asi-history-feature .rail-crossing,#asi-history-feature .rail-gates{transform:none} #asi-history-feature .scene-footer{align-items:flex-end} #asi-history-feature .team-person span{min-height:0;padding:8px 32px 8px 0} #asi-history-feature .team-person img{border-radius:6px} #asi-history-feature .team-person b{right:8px;top:8px} } @media(max-width:1050px) and (min-width:701px){ #asi-history-feature .rail-crossing,#asi-history-feature .rail-gates{transform:scale(.34)} #asi-history-feature #surfing{margin-left:auto;margin-right:0} #asi-history-feature #surfing .scene-panel{max-width:340px;margin-left:auto;margin-right:0} } /* History: counters, people, tunnel cover, and optional video. */ #asi-history-feature .road-tunnel{z-index:9;opacity:1;transform-origin:50% 50%} #asi-history-feature .history-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important} #asi-history-feature .history-count{display:inline-block;white-space:nowrap} #asi-history-feature [data-count-to]{display:inline-block;min-width:var(--count-width,4ch);font-variant-numeric:tabular-nums;text-align:right} #asi-history-feature .team-shuffle{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-top:15px;padding:10px 16px;border:1px solid #8ba793;border-radius:99px;background:#2c3831;color:#edf3ee;font:inherit;font-size:14px;cursor:pointer} #asi-history-feature .team-shuffle[hidden]{display:none} #asi-history-feature :is(.team-shuffle,.history-video-play,.team-person):focus-visible{outline:3px solid #cad8ba;outline-offset:5px} #asi-history-feature .team-person span{min-height:102px} #asi-history-feature .history-video{margin-top:32px;padding-top:27px;border-top:1px solid #526353} #asi-history-feature .history-video h3{font-size:28px;line-height:1.15;margin-bottom:18px} #asi-history-feature .history-video-screen{aspect-ratio:16/9;position:relative;background:#17211b;border-radius:8px;overflow:hidden} #asi-history-feature .history-video-play{display:block;width:100%;height:100%;position:relative;color:#fff;text-decoration:none;appearance:none;-webkit-appearance:none;border:0;padding:0;background:transparent;cursor:pointer;font:inherit;text-align:left} #asi-history-feature .history-video-play img{display:block;width:100%;height:100%;object-fit:cover} #asi-history-feature .history-video-play>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(0deg,#142019ae,#14201920);padding:14px;font-size:15px;font-weight:700} #asi-history-feature .history-video-play b{border:1px solid #e2eadc;border-radius:50%;width:46px;height:46px;display:grid;place-items:center;background:#273e32bf;flex-shrink:0} #asi-history-feature .history-video-screen iframe{display:block;width:100%;height:100%;border:0} #asi-history-feature .history-video-note{font-size:12px;line-height:1.6;color:#c0d0c4;margin-top:12px} #asi-history-feature .history-video-note a{display:inline-block;min-height:44px;padding:8px 0;color:inherit;text-underline-offset:3px} @media(max-width:700px){#asi-history-feature .team-person span{min-height:0}} /* Clear, short tire puffs and warm forward beams. Quiet mode remains still. */ #asi-history-feature[data-motion="active"] .road-car .headlight{display:block;top:-69px;width:34px;height:79px;z-index:-1;background:linear-gradient(to top,rgba(255,249,218,.87),rgba(255,249,218,.12) 65%,transparent);transition:opacity .4s} #asi-history-feature[data-motion="active"] .road-car.headlights-on .headlight{opacity:.96} #asi-history-feature[data-motion="active"] .road-car .tire-smoke{display:block;width:19px;height:25px;bottom:-4px;filter:blur(3px);background:#e6e9df} #asi-history-feature[data-motion="active"] .road-car.accelerating .tire-smoke{animation:asi-history-puff-v3 .95s ease-out both} #asi-history-feature[data-motion="active"] .road-car.accelerating .tire-smoke.right{animation-delay:.07s} @keyframes asi-history-puff-v3{0%{opacity:0;transform:translateY(-2px) scale(.3)}16%{opacity:.82}60%{opacity:.46}100%{opacity:0;transform:translateY(24px) scale(2.1)}} #asi-history-feature[data-motion="paused"] .headlight,#asi-history-feature[data-motion="paused"] .tire-smoke{display:none} /* Continuous vector water over the original bay artwork. */ #asi-history-feature .ocean-waves{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;overflow:visible} #asi-history-feature .surf-part{transition:none} #asi-history-feature .road-tunnel{width:115px;height:190px;opacity:1;z-index:9;transform-origin:50% 50%;object-fit:unset} #asi-history-feature .tunnel-roof{position:absolute;left:24%;right:24%;top:22%;bottom:22%;background:repeating-linear-gradient(0deg,transparent 0 19px,#7d8173 20px 22px),linear-gradient(90deg,#454d45,#a1a28c 45%,#707769 78%,#454d45);border:3px solid #707465;box-shadow:5px 0 7px #151d1755} #asi-history-feature .tunnel-mouth{position:absolute;left:0;bottom:0;width:100%;height:100px;object-fit:fill} #asi-history-feature .tunnel-far{top:0;bottom:auto;transform:rotate(180deg)} @media(max-width:700px){#asi-history-feature .road-tunnel{width:65px;height:114px}#asi-history-feature .tunnel-mouth{height:57px}} #asi-history-feature .bay-waiting{mask-image:radial-gradient(ellipse 11% 10% at 55.5% 34.5%,#000 60%,transparent 100%)} /* v5: scoped layout and resilient scene geometry. Keep this stylesheet out of wpautop. */ #asi-history-feature p:empty{display:none} #asi-history-feature .journey{max-width:1540px;padding-left:clamp(20px,5vw,84px);padding-right:clamp(20px,5vw,84px)} #asi-history-feature .wide-milestone{grid-template-columns:56px minmax(0,1fr);gap:22px 34px;align-items:start;padding:50px 0 64px} #asi-history-feature .milestone.wide-milestone .copy{grid-area:1/2;padding:0;max-width:760px} #asi-history-feature .milestone.wide-milestone .copy p{max-width:720px} #asi-history-feature .milestone.wide-milestone .pin{grid-area:1/1;translate:0;align-self:start;margin-top:20px} #asi-history-feature .milestone.wide-milestone .visual{grid-area:2/2;width:100%;max-width:1080px;margin:12px 0 0;position:relative;z-index:3} #asi-history-feature .large-story-art .story-art-frame{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden} #asi-history-feature .large-story-art .story-art-frame img{width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;border-radius:0;background:transparent} #asi-history-feature .large-story-art .story-art-frame:hover{transform:none;box-shadow:none} #asi-history-feature .large-story-art .story-art-frame:hover img{transform:scale(1.015)} #asi-history-feature .story-art-caption{display:grid;gap:6px;margin:20px 0 0;padding:18px 0 0;border-top:1px solid #819b8655;color:#c9d5cc;font-size:15px;line-height:1.55} #asi-history-feature .story-art-caption strong{font-size:20px;color:#e4ece2} #asi-history-feature #surfing{width:calc(100% - 90px);max-width:760px;margin:6px 0 78px 90px} #asi-history-feature #surfing .scene-panel{max-width:760px} #asi-history-feature .bay-scene{width:100%;height:auto;max-width:none;aspect-ratio:3/2;overflow:hidden;filter:saturate(.76) contrast(1.025);border-radius:12px;box-shadow:0 18px 38px #0003,0 0 0 1px #9bb2a52e} #asi-history-feature .bay-scene .surf-canvas{display:block!important;width:100%!important;height:auto!important;aspect-ratio:3/2;position:static!important;max-width:none} #asi-history-feature .surf-canvas .ocean-waves{position:static;width:auto;height:auto;overflow:visible} #asi-history-feature .baseball-context-row{position:relative;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:38px;align-items:center;margin:4px 0 66px 90px} #asi-history-feature .baseball-context-row .baseball-transition{width:100%;margin:0;min-width:0} #asi-history-feature .baseball-context-row .scene-panel{max-width:580px} #asi-history-feature .field-stories{position:relative;z-index:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:22px 0} #asi-history-feature .field-stories>.eyebrow,#asi-history-feature .field-stories>h3,#asi-history-feature .field-stories>p{grid-column:1/-1} #asi-history-feature .field-stories h3{font-size:clamp(32px,3.5vw,44px)} #asi-history-feature .field-stories>p{font-size:16px;line-height:1.55;color:#c9d6cc;margin:18px 0} #asi-history-feature .history-case{display:grid;align-content:start;gap:8px;padding:18px 17px;margin:6px 0 0;min-height:206px;text-decoration:none;background:linear-gradient(125deg,#9ab19d14,#19251e45);border:1px solid #78937f55;border-radius:10px;transition:background .2s,border-color .2s} #asi-history-feature .history-case:hover{background:#8da68f25;border-color:#afc7b4} #asi-history-feature .history-case strong{font-size:23px;color:#edf2e7;line-height:1.2} #asi-history-feature .history-case>span{font-size:14px;line-height:1.5;color:#c8d3c9} #asi-history-feature .history-case .case-scope{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#a5c2ad} #asi-history-feature .history-case b{font-size:13px;font-weight:400;color:#e1ecdd;margin-top:6px} #asi-history-feature .field-stories .case-time-note{font-size:12px;color:#a5b6aa} #asi-history-feature .reach-atlas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:28px;border:1px solid #80998555;border-radius:12px;background:linear-gradient(130deg,#91ab9511,#19251f88)} #asi-history-feature .reach-map-panel{min-width:0} #asi-history-feature .reach-map-panel+.reach-map-panel{border-left:1px solid #7c95814d;padding-left:24px} #asi-history-feature .reach-map-panel .eyebrow{font-size:11px;letter-spacing:.1em} #asi-history-feature .reach-map-panel .reach-map{display:block;width:100%;height:auto;aspect-ratio:535/270;margin:24px 0} #asi-history-feature .reach-map-panel h3{font-size:30px;line-height:1.15} #asi-history-feature .reach-map-panel>p:not(.eyebrow){font-size:15px;line-height:1.5;color:#c0d0c3;margin-top:12px} #asi-history-feature .reach-current{grid-column:1/-1;border-top:1px solid #819b8655;padding-top:22px;display:flex;align-items:center;gap:30px;flex-wrap:wrap} #asi-history-feature .reach-current>span{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:#acc5b3} #asi-history-feature .reach-current strong{font-size:38px;font-weight:400;line-height:1.2;color:#e2eddf} #asi-history-feature .reach-current small{font-size:14px;white-space:nowrap} #asi-history-feature .reach-trace{stroke-dasharray:1;stroke-dashoffset:1} #asi-history-feature .is-drawn .reach-trace{animation:asi-atlas-draw 2.4s ease-out forwards} #asi-history-feature .is-drawn .reach-map-panel:nth-child(2) .reach-trace{animation-delay:.6s} @keyframes asi-atlas-draw{to{stroke-dashoffset:0}} #asi-history-feature[data-motion="paused"] .reach-trace{stroke-dashoffset:0;animation:none} #asi-history-feature .road-tunnel{width:104px;height:200px;z-index:9;opacity:1;transform-origin:50% 50%;pointer-events:none} #asi-history-feature .road-tunnel .tunnel-structure{display:block;width:100%;height:100%;max-width:none} #asi-history-feature .credential-card.credential-v5{position:relative;background:linear-gradient(135deg,#31483b,#1d2d24);color:#e5eddf;border:1px solid #90aa925e;border-radius:14px;padding:26px 24px;box-shadow:0 18px 36px #0002;overflow:hidden} #asi-history-feature .credential-v5:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(#aec6a8,#729b7b)} #asi-history-feature .credential-v5 .credential-heading{display:grid;grid-template-columns:94px minmax(0,1fr);border:0;gap:14px;align-items:center} #asi-history-feature .credential-v5 .credential-heading img{width:86px;height:auto;max-height:45px;object-fit:contain;background:#ecf0e5;border-radius:5px;padding:4px} #asi-history-feature .credential-v5 .credential-heading>span{font-size:12px;line-height:1.4;color:#bcd0be;letter-spacing:.05em;max-width:none;text-align:center} #asi-history-feature .credential-v5 .credential-number{display:block;max-width:none;margin:24px 0 20px;padding:0;color:#afc5b4;font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-align:center} #asi-history-feature .credential-v5 .credential-number strong{display:block;font-size:clamp(29px,3vw,40px);line-height:1.1;letter-spacing:.025em;color:#edf3e8;margin:6px 0 16px;white-space:nowrap} #asi-history-feature .credential-rule{display:block;height:1px;width:100%;background:linear-gradient(90deg,#b7cba1,#76998422)} #asi-history-feature .credential-v5 .classification-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;border:0;background:transparent} #asi-history-feature .credential-v5 .classification-panel a{display:grid;grid-template-columns:1fr;align-content:start;justify-items:center;gap:8px;min-width:0;min-height:150px;border:1px solid #a7beab38;border-radius:8px;padding:15px 12px;background:#c4d6b90a;text-align:center;text-decoration:none;color:#dce8d5;transition:background .2s,border-color .2s} #asi-history-feature .credential-v5 .classification-panel a:hover{background:#b5cba71a;border-color:#abc5b0} #asi-history-feature .credential-v5 .classification-panel strong{font-family:"PT Sans",Arial,sans-serif;font-size:24px;font-weight:700;line-height:1.25;letter-spacing:0;color:#eef4e9;white-space:nowrap} #asi-history-feature .credential-v5 .classification-panel a>span{font-size:12px;line-height:1.4;color:#b8cdbd;text-align:center} #asi-history-feature .credential-v5 .credential-icon{display:block;width:28px;height:28px;color:#c4d7b8;margin:0 auto 6px} #asi-history-feature .credential-v5 .credential-footer{display:flex;justify-content:center;text-align:center;gap:8px;margin-top:20px;border:0;padding:0;color:#b9ccba;font-size:11px;line-height:1.4} #asi-history-feature .credential-v5 .credential-footer a{color:#edf3e5;font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:6px 0} #asi-history-feature .construction-milestone-visual .scene-panel{padding:18px 10px;border:0;background:transparent;box-shadow:none;border-radius:0;max-width:680px} #asi-history-feature .construction-milestone-visual .workplace-build{width:100%;height:auto} @media(min-width:1100px){#asi-history-feature #licensed{grid-template-columns:minmax(0,.82fr) 80px minmax(0,1.18fr)}} @media(max-width:900px){#asi-history-feature .baseball-context-row{grid-template-columns:1fr;gap:24px}#asi-history-feature .baseball-context-row .baseball-transition{max-width:600px}#asi-history-feature .history-case{padding:18px;min-height:0}#asi-history-feature .reach-atlas{padding:20px;gap:18px}} @media(max-width:700px){ #asi-history-feature .journey{padding:0 16px} #asi-history-feature .wide-milestone{grid-template-columns:28px minmax(0,1fr);gap:18px 15px;padding:34px 0 48px} #asi-history-feature .milestone.wide-milestone .pin{margin-top:15px} #asi-history-feature .milestone.wide-milestone .visual{margin-top:4px} #asi-history-feature .story-art-caption{font-size:13px;margin-top:14px;padding-top:14px} #asi-history-feature .story-art-caption strong{font-size:17px;line-height:1.4} #asi-history-feature #surfing{width:calc(100% - 43px);margin:0 0 54px 43px} #asi-history-feature .baseball-context-row{margin:0 0 44px 43px} #asi-history-feature .field-stories h3{font-size:32px} #asi-history-feature .field-stories>p{font-size:14px} #asi-history-feature .field-stories{grid-template-columns:1fr;gap:10px} #asi-history-feature .field-stories>*{grid-column:1} #asi-history-feature .reach-atlas{grid-template-columns:1fr;padding:16px;gap:24px} #asi-history-feature .reach-map-panel+.reach-map-panel{border-left:0;border-top:1px solid #7c95814d;padding:24px 0 0} #asi-history-feature .reach-current{gap:16px;align-items:flex-start} #asi-history-feature .reach-current>span{width:100%;font-size:11px} #asi-history-feature .reach-current strong{font-size:32px} #asi-history-feature .reach-current small{display:block;font-size:12px} #asi-history-feature .road-tunnel{width:66px;height:127px} #asi-history-feature .credential-card.credential-v5{padding:21px 16px} #asi-history-feature .credential-v5 .classification-panel{gap:8px} #asi-history-feature .credential-v5 .classification-panel a{padding:13px 9px} #asi-history-feature .credential-v5 .classification-panel strong{font-size:clamp(17px,4.6vw,24px)} #asi-history-feature .credential-v5 .credential-heading>span{font-size:11px} } /* v5.0.4 final polish: keep the route in its gutter and replace the white divider with a quiet navigation stitch. */ #asi-history-feature .route-svg{z-index:0} #asi-history-feature .route-lanes{stroke:#708a78;stroke-width:1;opacity:.22} #asi-history-feature .route-progress{opacity:.075} #asi-history-feature .milestone,#asi-history-feature .feature-stop,#asi-history-feature .baseball-context-row,#asi-history-feature .next-stop{position:relative;z-index:2} #asi-history-feature .ocean-waves [data-wave-face]{fill-opacity:.92;filter:drop-shadow(0 8px 9px #174f5c66)} #asi-history-feature .ocean-waves [data-wave-foam]{stroke-width:5;filter:drop-shadow(0 1px 2px #eef8f0cc)} #asi-history-feature .ocean-waves [data-wave-trail]{stroke-width:2;opacity:.7} @media(max-width:700px){ #asi-history-feature .route-lanes{opacity:.17;} #asi-history-feature .wide-milestone{grid-template-columns:30px minmax(0,1fr);gap:18px 15px;padding:34px 0 48px} #asi-history-feature #surfing{width:calc(100% - 45px);margin:2px 0 54px 45px} #asi-history-feature .baseball-context-row{margin:2px 0 44px 45px} #asi-history-feature .credential-v5 .credential-heading{grid-template-columns:78px minmax(0,1fr)} #asi-history-feature .credential-v5 .classification-panel a{min-height:136px} } @media(prefers-reduced-motion:reduce){#asi-history-feature:not([data-motion="active"]) .reach-trace{stroke-dashoffset:0;animation:none}} /* Remove the distracting dotted trail; keep the continuous road surface and car. */ #asi-history-feature .route-lanes{display:none} /* Detailed static artwork receives a full story row at every milestone. */ #asi-history-feature #programs .large-story-art .story-art-frame img{aspect-ratio:auto;max-height:none} #asi-history-feature #recognition .visual{max-width:760px} #asi-history-feature #recognition .award-frame{border-width:2px;background:transparent;padding:0;border-radius:4px} #asi-history-feature #today .visual{max-width:1120px} #asi-history-feature #today .team-portraits{grid-template-columns:repeat(4,minmax(0,1fr));padding:16px;gap:18px} #asi-history-feature .next-visual{width:100%;max-width:1000px;margin-left:auto;margin-right:auto} #asi-history-feature .next-visual .frame{background:transparent;border:0;box-shadow:none;padding:0;border-radius:0} #asi-history-feature .next-visual .frame img{width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain} @media(max-width:1050px){#asi-history-feature #today .team-portraits{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:700px){#asi-history-feature #today .team-portraits{grid-template-columns:1fr;padding:12px;gap:12px}} /* v5.0.6 surf and tunnel correction. */ #asi-history-feature .bay-scene{ filter:saturate(.9) contrast(1.035); box-shadow:0 20px 42px #0004,0 0 0 1px #b8d1c338; } #asi-history-feature .ocean-waves [data-wave-face]{ fill-opacity:1; filter:drop-shadow(0 11px 13px #123f5066); } #asi-history-feature .ocean-waves [data-wave-foam]{ fill:#edf8f0a8; stroke-width:2.5; filter:drop-shadow(0 2px 4px #f4fbf2cc); } #asi-history-feature .ocean-waves [data-wave-trail]{display:none} #asi-history-feature .road-tunnel{ width:132px; height:226px; opacity:1; z-index:9; filter:drop-shadow(0 12px 12px #0b120d66); } #asi-history-feature .road-tunnel .tunnel-structure{ display:block; width:100%; height:100%; max-width:none; overflow:visible; } @media(max-width:700px){ #asi-history-feature .ocean-waves [data-wave-foam]{stroke-width:3} #asi-history-feature .road-tunnel{width:84px;height:144px} } /* Keep the car in a clear road gutter beside the expanded story artwork. */ #asi-history-feature .milestone.wide-milestone.copy-right .pin{translate:14px} #asi-history-feature #licensed{grid-template-columns:48px minmax(0,.85fr) minmax(0,1.15fr);gap:26px;align-items:center} #asi-history-feature #licensed .copy{grid-area:1/2;padding:0} #asi-history-feature #licensed .visual{grid-area:1/3} #asi-history-feature #licensed .pin{grid-area:1/1;translate:0} #asi-history-feature .next-stop{padding-left:80px} #asi-history-feature .next-stop .pin{position:absolute;left:12px;top:66px;margin:0;width:26px;height:26px;font-size:14px} #asi-history-feature .next-content{grid-template-columns:1fr;gap:36px} #asi-history-feature .next-copy{max-width:680px} @media(max-width:700px){ #asi-history-feature .milestone.wide-milestone.copy-right .pin{translate:0} #asi-history-feature #licensed{grid-template-columns:28px minmax(0,1fr);gap:18px 15px} #asi-history-feature #licensed .visual{grid-area:2/2} #asi-history-feature #licensed .pin{align-self:start;margin-top:15px} #asi-history-feature .next-stop{padding-left:43px;margin-left:0} #asi-history-feature #next .pin{left:5px;top:42px} } /* v5.0.4 cohesive final polish: one quiet road gutter, cleaner scene edges, and centered credentials. */ #asi-history-feature .timeline{--asi-road-gutter-shift:-12px} #asi-history-feature .route-svg,#asi-history-feature .road-car,#asi-history-feature .rail-crossing,#asi-history-feature .rail-gates,#asi-history-feature .road-tunnel{margin-left:var(--asi-road-gutter-shift)} #asi-history-feature .route-bed{stroke-width:34;stroke:#607a68} #asi-history-feature .route-surface{stroke-width:30;stroke:#29332d} #asi-history-feature .route-progress{stroke-width:30;opacity:.08} #asi-history-feature .bay-scene:after{content:"";position:absolute;inset:0;z-index:4;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 28px 8px #22242566,inset 0 -18px 30px #1e333c38} #asi-history-feature #markets{min-height:410px;padding-bottom:24px} #asi-history-feature #licensed{min-height:420px;padding-top:24px} #asi-history-feature .credential-v5 .credential-heading{grid-template-columns:1fr;justify-items:center;text-align:center;gap:10px} #asi-history-feature .credential-v5 .credential-heading img{margin:0 auto} #asi-history-feature .credential-v5 .credential-heading>span{max-width:260px;text-align:center} #asi-history-feature .credential-v5 .classification-panel a{align-content:center} #asi-history-feature .credential-v5 .classification-panel strong{display:block;width:100%;text-align:center} @media(max-width:700px){ body.admin-bar.page-id-5926 #asi-history-feature .milestone-nav,#asi-history-feature .milestone-nav{position:relative;top:auto!important;z-index:5} #asi-history-feature .timeline{--asi-road-gutter-shift:-7px} #asi-history-feature #markets{min-height:0;padding-bottom:22px} #asi-history-feature #licensed{min-height:0;padding-top:22px} #asi-history-feature .credential-v5 .credential-heading{grid-template-columns:1fr} #asi-history-feature .credential-v5 .classification-panel a{min-height:128px} } /* v5.0.5 WordPress integration hardening: remove the vertical grid divider and ignore empty formatter paragraphs. */ #asi-history-feature .journey::before{background-image:linear-gradient(rgba(155,184,162,.027) 1px,transparent 1px)} #asi-history-feature .milestone>p:empty{display:none!important} /* v5.0.6 credential polish: the license certificate responds to its column, not only the browser. */ #asi-history-feature .copy .credential-card.credential-v5{ width:100%; max-width:none; box-sizing:border-box; container:asi-credential/inline-size; padding:clamp(20px,5cqi,30px) clamp(16px,4.8cqi,26px); } #asi-history-feature .credential-v5 .credential-heading{ display:grid; grid-template-columns:1fr; justify-items:center; gap:10px; padding:0; text-align:center; } #asi-history-feature .credential-v5 .credential-heading img{ display:block; width:clamp(112px,30cqi,142px); height:auto; max-height:70px; margin:0 auto; padding:0; border:0; border-radius:0; background:transparent; object-fit:contain; mix-blend-mode:normal; filter:brightness(0) saturate(100%) invert(91%) sepia(12%) saturate(319%) hue-rotate(62deg) brightness(104%) contrast(92%); opacity:.96; } #asi-history-feature .credential-v5 .credential-heading>span{ width:100%; max-width:310px; margin:0 auto; font-size:clamp(11px,2.9cqi,13px); line-height:1.35; text-align:center; } #asi-history-feature .credential-v5 .credential-number{margin:clamp(18px,4cqi,24px) 0 20px} #asi-history-feature .credential-v5 .credential-number strong{ font-size:clamp(32px,9cqi,42px); white-space:normal; overflow-wrap:normal; } #asi-history-feature .credential-v5 .classification-panel{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(10px,2.8cqi,14px); width:100%; min-width:0; margin-top:0; overflow:visible; } #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a, #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a:nth-child(2n), #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a:nth-child(2n+1), #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a:nth-child(-n+2){ display:grid; grid-template-rows:auto auto minmax(0,1fr); align-content:start; justify-items:center; gap:8px; min-width:0; min-height:clamp(176px,40cqi,198px); margin:0; padding:clamp(16px,4cqi,21px) clamp(9px,2.8cqi,14px); border:1px solid #a7beab52; border-radius:10px; background:linear-gradient(145deg,#c4d6b910,#c4d6b905); text-align:center; overflow:hidden; } #asi-history-feature .credential-v5 .credential-icon{ display:block; width:clamp(56px,14cqi,64px); height:clamp(56px,14cqi,64px); margin:0 auto 6px; stroke-width:1.9; } #asi-history-feature .credential-v5 .classification-panel strong, #asi-history-feature .credential-card .classification-panel strong{ display:block; width:100%; min-width:0; margin:0; font-size:clamp(18px,5.7cqi,25px); line-height:1.12; letter-spacing:0; text-align:center; white-space:normal; overflow-wrap:normal; word-break:normal; } #asi-history-feature .credential-v5 .classification-panel a>span, #asi-history-feature .credential-card .classification-panel a>span{ display:block; width:100%; min-width:0; margin:0; font-size:clamp(11px,3cqi,13px); line-height:1.34; text-align:center; white-space:normal; overflow-wrap:normal; word-break:normal; } #asi-history-feature .credential-v5 .credential-footer{ display:grid; grid-template-columns:1fr; justify-items:center; gap:7px; margin-top:clamp(17px,4cqi,22px); text-align:center; } #asi-history-feature .credential-v5 .credential-footer span, #asi-history-feature .copy .credential-card.credential-v5 .credential-footer a{ display:block; width:100%; max-width:none; margin:0; padding:4px 0; text-align:center; justify-self:center; } @container asi-credential (max-width:350px){ #asi-history-feature .credential-v5 .classification-panel{grid-template-columns:1fr} #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a, #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a:nth-child(2n), #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a:nth-child(2n+1), #asi-history-feature .copy .credential-card.credential-v5 .classification-panel a:nth-child(-n+2){min-height:142px;padding:15px 14px} #asi-history-feature .credential-v5 .credential-icon{width:56px;height:56px;margin-bottom:4px} #asi-history-feature .credential-v5 .classification-panel strong, #asi-history-feature .credential-card .classification-panel strong{font-size:21px} #asi-history-feature .credential-v5 .classification-panel a>span, #asi-history-feature .credential-card .classification-panel a>span{font-size:12px} } /* v5.0.7 bounded visual cleanup: opening palms only, quiet route markers, larger credentials and three featured people. */ #asi-history-feature .palm-later, #asi-history-feature .palm-companion{display:none!important} #asi-history-feature .milestone .pin, #asi-history-feature .milestone.copy-left .pin, #asi-history-feature .milestone.copy-right .pin, #asi-history-feature .milestone.wide-milestone .pin, #asi-history-feature .milestone.wide-milestone.copy-right .pin{ width:18px; height:18px; margin-top:0; translate:0; color:transparent; font-size:0; border:1px solid rgba(181,207,189,.72); background:#5e7866; box-shadow:none; backdrop-filter:none; } #asi-history-feature .milestone.is-active .pin{ background:#a8c8b1; border-color:#d6e6d9; box-shadow:none; } #asi-history-feature #today .team-portraits{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px} @media(max-width:700px){ #asi-history-feature .milestone .pin, #asi-history-feature .milestone.copy-left .pin, #asi-history-feature .milestone.copy-right .pin, #asi-history-feature .milestone.wide-milestone .pin, #asi-history-feature .milestone.wide-milestone.copy-right .pin{width:15px;height:15px;margin-top:17px} #asi-history-feature .milestone.is-active .pin{box-shadow:none} #asi-history-feature #today .team-portraits{grid-template-columns:1fr} #asi-history-feature .credential-v5 .credential-icon{width:48px;height:48px} } /* Surf v5.0.7: one traveling break, a face-relative carve, and a restrained distant breach. */ #asi-history-feature .surf-wave-drift{ transform-box:view-box; transform-origin:center; animation:asi-surf-wave-drift 3.6s ease-in-out infinite; } #asi-history-feature .surf-rider-carve{ transform-box:view-box; transform-origin:center; animation:asi-surf-rider-carve 1.8s ease-in-out infinite; } #asi-history-feature .dolphin-body,#asi-history-feature .dolphin-fin{fill:#597b7e;stroke:#d8e9e5;stroke-width:2} #asi-history-feature .dolphin-splash{fill:none;stroke:#e8f3ef;stroke-width:3;stroke-linecap:round} #asi-history-feature[data-motion="paused"] .surf-wave-drift, #asi-history-feature[data-motion="paused"] .surf-rider-carve{animation-play-state:paused} @keyframes asi-surf-wave-drift{ 0%,100%{transform:translate(12px,2px) scale(.985)} 50%{transform:translate(-20px,-4px) scale(1.025)} } @keyframes asi-surf-rider-carve{ 0%,100%{transform:translate(3px,9px) rotate(1deg)} 50%{transform:translate(-6px,-10px) rotate(-3deg)} } @media (prefers-reduced-motion:reduce){ #asi-history-feature .surf-wave-drift,#asi-history-feature .surf-rider-carve{animation:none} } /* v5.0.8 WordPress contrast hardening for the two light-green action links. */ #asi-history-feature a.team-action, #asi-history-feature a.team-action:link, #asi-history-feature a.team-action:visited{ color:#1e3326!important; background-color:#a9c0af; } #asi-history-feature a.cta, #asi-history-feature a.cta:link, #asi-history-feature a.cta:visited{ color:#18261c!important; background-color:#96b49f; } #asi-history-feature a.team-action>*, #asi-history-feature a.cta>*{color:inherit!important} #asi-history-feature a.team-action:hover, #asi-history-feature a.team-action:focus-visible, #asi-history-feature a.cta:hover, #asi-history-feature a.cta:focus-visible{ color:#14251a!important; background-color:#bdd0c1; } #asi-history-feature a.team-action:focus-visible, #asi-history-feature a.cta:focus-visible{ outline:3px solid #e7f0e9; outline-offset:3px; } /* v5.1.0 cohesive story pass */ #asi-history-feature .intro{padding-top:clamp(54px,8vw,112px);padding-bottom:clamp(50px,7vw,92px)} #asi-history-feature .intro .lead{max-width:980px;font-size:clamp(17px,1.55vw,21px);line-height:1.68;color:#d4ded6} #asi-history-feature .story-art-caption{display:none!important} #asi-history-feature .large-story-art .story-art-frame{position:relative;border-radius:16px;background:#1b241f;box-shadow:0 24px 52px #0004,0 0 0 1px #9eb4a31f} #asi-history-feature .large-story-art .story-art-frame img{border-radius:16px;transition:transform .8s ease,filter .8s ease} #asi-history-feature .milestone.is-active .story-art-frame img{transform:scale(1.012);filter:saturate(.96) contrast(1.025)} #asi-history-feature .milestone .pin, #asi-history-feature .milestone.copy-left .pin, #asi-history-feature .milestone.copy-right .pin, #asi-history-feature .milestone.wide-milestone .pin, #asi-history-feature .milestone.wide-milestone.copy-right .pin{width:13px;height:13px;border-radius:2px;rotate:45deg;background:#78937f;border:1px solid #c1d5c5;box-shadow:0 0 0 7px #26332c} #asi-history-feature .milestone.is-active .pin{background:#b7d0bd;box-shadow:0 0 0 7px #26332c,0 0 20px #a8c8b15c} #asi-history-feature #licensed{margin-top:clamp(48px,7vw,108px);padding-top:clamp(42px,5vw,78px);padding-bottom:clamp(64px,8vw,122px);align-items:start} #asi-history-feature #licensed .copy{max-width:610px} #asi-history-feature #licensed .construction-milestone-visual{align-self:start;margin-top:clamp(52px,7vw,104px)} #asi-history-feature .construction-milestone-visual .scene-panel{position:relative;max-width:720px;padding:24px;border:1px solid #8fa9933b;border-radius:18px;background:linear-gradient(155deg,#a9c0af0d,#111a155e);box-shadow:0 24px 54px #0003} #asi-history-feature .construction-milestone-visual .eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 8px;padding-left:1px} #asi-history-feature .construction-milestone-visual .eyebrow:before{content:"";width:10px;height:10px;rotate:45deg;border-radius:1px;background:#9bbba4;box-shadow:0 0 0 5px #304038} #asi-history-feature .credential-card.credential-v5{border-color:#9fb5a46b;background:linear-gradient(145deg,#334c3d,#1a2b22 78%);box-shadow:0 28px 58px #0004} #asi-history-feature .credential-v5 .classification-panel a{transition:transform .24s ease,background .24s ease,border-color .24s ease} #asi-history-feature .credential-v5 .classification-panel a:hover{transform:translateY(-3px)} #asi-history-feature .credential-v5 .credential-icon{width:clamp(62px,16cqi,74px);height:clamp(62px,16cqi,74px)} #asi-history-feature .credential-v5 .classification-panel a>span{min-height:2.7em;display:flex;align-items:flex-start;justify-content:center} #asi-history-feature #today{padding-top:clamp(70px,8vw,122px)} #asi-history-feature #today .team-portraits{border:1px solid #9bb3a14a;border-radius:16px;background:linear-gradient(145deg,#dbe6dcf0,#b8cabbbf);box-shadow:0 24px 56px #0003} #asi-history-feature #today .team-person{overflow:hidden;border-radius:12px;background:#f2f5ef;box-shadow:0 8px 22px #12201821;transition:transform .25s ease,box-shadow .25s ease} #asi-history-feature #today .team-person:hover{transform:translateY(-5px);box-shadow:0 15px 30px #12201838} #asi-history-feature #today .team-person span{background:#edf2eb;color:#263b2d;padding:13px 14px} #asi-history-feature #today .team-person strong,#asi-history-feature #today .team-person small{color:#263b2d!important} #asi-history-feature .next-stop{margin-top:clamp(58px,8vw,116px);padding-top:clamp(46px,6vw,82px);border-top:1px solid #89a08e42} #asi-history-feature .next-visual .frame{border-radius:18px;overflow:hidden;box-shadow:0 28px 60px #0004,0 0 0 1px #9db3a23d} /* Story-motion overlays replay whenever their milestone becomes active. */ #asi-history-feature .story-motion{position:absolute;inset:0;z-index:2;overflow:hidden;border-radius:inherit;pointer-events:none} #asi-history-feature .story-motion i{position:absolute;display:block;opacity:0} #asi-history-feature .map-motion i{left:21%;top:65%;width:14px;height:14px;border:2px solid #d8ead9;border-radius:50%;background:#88aa91;box-shadow:0 0 0 0 #cfe4d188} #asi-history-feature .map-motion i:nth-child(2){animation-delay:.8s} #asi-history-feature .map-motion i:nth-child(3){animation-delay:1.6s} #asi-history-feature .milestone.is-active .map-motion i{animation:asi-map-pulse 2.4s ease-out infinite} @keyframes asi-map-pulse{0%{opacity:.9;transform:scale(.45);box-shadow:0 0 0 0 #cfe4d1aa}72%,100%{opacity:0;transform:scale(1.3);box-shadow:0 0 0 24px #cfe4d100}} #asi-history-feature #foundation .story-art-frame>img{transition:filter .7s ease,opacity .7s ease,transform .9s ease} #asi-history-feature #foundation.is-active .story-art-frame>img{animation:asi-delivery-base 10s cubic-bezier(.2,.75,.2,1) both} @keyframes asi-delivery-base{0%,60%{opacity:.025;filter:saturate(.12) brightness(.22) blur(10px);transform:scale(1.025)}80%,100%{opacity:1;filter:none;transform:scale(1)}} #asi-history-feature .delivery-motion:before{content:"";position:absolute;z-index:3;left:46%;top:2%;width:9%;aspect-ratio:1.25;border:2px solid #c9d7c8;border-radius:3px;background:linear-gradient(145deg,#8ba190,#52675a);box-shadow:inset 0 0 0 3px #26352c99,0 12px 18px #0007;clip-path:polygon(8% 18%,50% 0,92% 18%,92% 84%,50% 100%,8% 84%);opacity:0} #asi-history-feature .milestone.is-active .delivery-motion:before{animation:asi-parts-crate 2.1s ease-out both} @keyframes asi-parts-crate{0%{opacity:0;transform:translateY(-70px) rotate(-7deg) scale(.7)}28%,68%{opacity:.95;transform:translateY(0) rotate(0) scale(1)}100%{opacity:0;transform:translateY(8px) scale(.82)}} #asi-history-feature .delivery-motion .assembly-piece{--delay:0s;--drop-x:0px;--turn:0deg;inset:0;background-image:url("https://asicoinc.com/wp-content/uploads/2026/09/asi-history-delivery-hub-a8d4b387a8.webp");background-repeat:no-repeat;background-size:100% 100%;background-position:center;filter:saturate(.97);transform-origin:center} #asi-history-feature .delivery-motion .piece-shell{clip-path:polygon(0 0,34% 0,31% 34%,0 30%);--delay:.55s;--drop-x:-18px;--turn:-5deg} #asi-history-feature .delivery-motion .piece-truck{clip-path:polygon(34% 0,67% 0,70% 31%,31% 34%);--delay:1.25s;--drop-x:42px;--turn:7deg} #asi-history-feature .delivery-motion .piece-cartons{clip-path:polygon(67% 0,100% 0,100% 34%,70% 31%);--delay:2s;--drop-x:-34px;--turn:-8deg} #asi-history-feature .delivery-motion .piece-planning-wall{clip-path:polygon(0 30%,31% 34%,34% 68%,0 64%);--delay:2.75s;--drop-x:28px;--turn:5deg} #asi-history-feature .delivery-motion .piece-planners{clip-path:polygon(31% 34%,70% 31%,67% 66%,34% 68%);--delay:3.5s;--drop-x:-26px;--turn:-6deg} #asi-history-feature .delivery-motion .piece-glass-room{clip-path:polygon(70% 31%,100% 34%,100% 67%,67% 66%);--delay:4.25s;--drop-x:36px;--turn:8deg} #asi-history-feature .delivery-motion .piece-workstations{clip-path:polygon(0 64%,34% 68%,31% 100%,0 100%);--delay:5s;--drop-x:-32px;--turn:-7deg} #asi-history-feature .delivery-motion .piece-installers{clip-path:polygon(34% 68%,67% 66%,70% 100%,31% 100%);--delay:5.75s;--drop-x:23px;--turn:6deg} #asi-history-feature .delivery-motion .piece-finishes{clip-path:polygon(67% 66%,100% 67%,100% 100%,70% 100%);--delay:6.5s;--drop-x:-14px;--turn:-4deg} #asi-history-feature .milestone.is-active .delivery-motion .assembly-piece{animation-name:asi-delivery-assemble;animation-duration:calc(10s - var(--delay));animation-delay:var(--delay);animation-timing-function:cubic-bezier(.16,.82,.2,1);animation-fill-mode:both} @keyframes asi-delivery-assemble{0%{opacity:0;transform:translate(var(--drop-x),-185px) scale(.22) rotate(var(--turn));filter:saturate(.7) blur(3px) drop-shadow(0 14px 13px #000b)}16%{opacity:1}34%,92%{opacity:1;transform:translate(0,0) scale(1) rotate(0);filter:saturate(.97) blur(0) drop-shadow(0 2px 1px #0002)}100%{opacity:0;transform:translate(0,0) scale(1)}} #asi-history-feature .delivery-motion .completion-sheen{inset:-15% auto -15% -28%;width:18%;background:linear-gradient(90deg,transparent,#eff8ee8c,transparent);transform:skewX(-14deg)} #asi-history-feature .milestone.is-active .delivery-motion .completion-sheen{animation:asi-completion-sheen 2.8s 7.2s ease-in-out both} @keyframes asi-completion-sheen{0%{opacity:0;left:-28%}18%{opacity:.6}62%,100%{opacity:0;left:112%}} #asi-history-feature .workplace-motion .signal{width:12px;height:12px;border-radius:50%;background:#b9d2be;box-shadow:0 0 0 0 #b9d2be88} #asi-history-feature .workplace-motion .signal-a{left:24%;top:30%}#asi-history-feature .workplace-motion .signal-b{left:55%;top:52%}#asi-history-feature .workplace-motion .signal-c{left:78%;top:27%} #asi-history-feature .milestone.is-active .workplace-motion .signal{animation:asi-office-signal 2.2s ease-out infinite} #asi-history-feature .milestone.is-active .workplace-motion .signal-b{animation-delay:.65s}#asi-history-feature .milestone.is-active .workplace-motion .signal-c{animation-delay:1.3s} @keyframes asi-office-signal{0%{opacity:.9;box-shadow:0 0 0 0 #b9d2be8c}75%,100%{opacity:0;box-shadow:0 0 0 28px #b9d2be00}} #asi-history-feature .workplace-motion .connection-line{height:2px;background:linear-gradient(90deg,transparent,#c8ddcc,#7e9d87,transparent);filter:drop-shadow(0 0 5px #c8ddcc66);transform-origin:left center} #asi-history-feature .workplace-motion .connection-line-a{left:24%;top:31%;width:36%;rotate:28deg} #asi-history-feature .workplace-motion .connection-line-b{left:55%;top:52%;width:28%;rotate:-34deg} #asi-history-feature .milestone.is-active .workplace-motion .connection-line{animation:asi-workplace-connect 4.4s ease-in-out infinite} #asi-history-feature .milestone.is-active .workplace-motion .connection-line-b{animation-delay:.75s} @keyframes asi-workplace-connect{0%,10%{opacity:0;transform:scaleX(0)}30%,64%{opacity:.68;transform:scaleX(1)}82%,100%{opacity:0;transform:scaleX(1)}} #asi-history-feature .programs-motion .program-route-map{position:absolute;inset:0;width:100%;height:100%;overflow:visible} #asi-history-feature .programs-motion .program-routes path{fill:none;stroke:#d6ead9;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 5px #b7d1bd99);opacity:0} #asi-history-feature .programs-motion .program-sites circle{fill:#bcd4c1;stroke:#284134;stroke-width:5;filter:drop-shadow(0 0 8px #d3e8d5);opacity:0;transform-box:fill-box;transform-origin:center} #asi-history-feature .programs-motion .program-sites rect{fill:#dbe9dc;stroke:#284134;stroke-width:5;filter:drop-shadow(0 0 10px #d3e8d5);opacity:0} #asi-history-feature .milestone.is-active .programs-motion .program-routes path{animation:asi-program-route 5.6s ease-in-out infinite} #asi-history-feature .milestone.is-active .programs-motion .program-routes path:nth-child(2){animation-delay:.35s}#asi-history-feature .milestone.is-active .programs-motion .program-routes path:nth-child(3){animation-delay:.7s}#asi-history-feature .milestone.is-active .programs-motion .program-routes path:nth-child(4){animation-delay:1.05s} #asi-history-feature .milestone.is-active .programs-motion .program-sites circle{animation:asi-program-site 5.6s ease-in-out infinite} #asi-history-feature .milestone.is-active .programs-motion .program-sites circle:nth-child(2){animation-delay:.35s}#asi-history-feature .milestone.is-active .programs-motion .program-sites circle:nth-child(3){animation-delay:.7s}#asi-history-feature .milestone.is-active .programs-motion .program-sites circle:nth-child(4){animation-delay:1.05s} #asi-history-feature .milestone.is-active .programs-motion .program-sites rect{animation:asi-program-hub 5.6s ease-in-out infinite} @keyframes asi-program-route{0%,8%{opacity:0;stroke-dashoffset:90}24%,70%{opacity:.78;stroke-dashoffset:0}88%,100%{opacity:0;stroke-dashoffset:-70}} @keyframes asi-program-site{0%,16%{opacity:0;scale:.45}30%,66%{opacity:1;scale:1}76%{opacity:.72;scale:1.42}90%,100%{opacity:0;scale:.8}} @keyframes asi-program-hub{0%,100%{opacity:.35}22%,72%{opacity:1}45%{filter:drop-shadow(0 0 24px #d3e8d5)}} @media(max-width:900px){ #asi-history-feature #licensed{grid-template-columns:32px minmax(0,1fr);gap:22px 18px} #asi-history-feature #licensed .copy{grid-area:1/2;max-width:none} #asi-history-feature #licensed .visual{grid-area:2/2;margin-top:24px} #asi-history-feature #licensed .pin{grid-area:1/1} } @media(max-width:700px){ #asi-history-feature .large-story-art .story-art-frame,#asi-history-feature .large-story-art .story-art-frame img{border-radius:12px} #asi-history-feature #licensed{margin-top:28px;padding-top:34px;padding-bottom:70px} #asi-history-feature #licensed .construction-milestone-visual{margin-top:26px} #asi-history-feature .construction-milestone-visual .scene-panel{padding:15px 8px;border-radius:14px} #asi-history-feature .milestone .pin,#asi-history-feature .milestone.copy-left .pin,#asi-history-feature .milestone.copy-right .pin,#asi-history-feature .milestone.wide-milestone .pin,#asi-history-feature .milestone.wide-milestone.copy-right .pin{width:11px;height:11px;margin-top:19px;box-shadow:0 0 0 5px #26332c} #asi-history-feature .story-motion .connection-line{height:1.5px} } @media(prefers-reduced-motion:reduce){#asi-history-feature .story-motion{display:none}} #asi-history-feature[data-motion="paused"] .story-motion i{animation-play-state:paused!important} /* 2021 composition: one story followed by two related proof points. */ #asi-history-feature #licensed{display:grid;grid-template-columns:34px minmax(330px,.82fr) minmax(0,1.18fr);grid-template-rows:auto auto auto auto auto;column-gap:clamp(26px,4vw,58px);row-gap:18px;align-items:start} #asi-history-feature #licensed .copy{display:contents} #asi-history-feature #licensed .copy>.date{grid-column:2/4;grid-row:1;margin:0} #asi-history-feature #licensed .copy>h2{grid-column:2/4;grid-row:2;max-width:900px;margin:0 0 4px} #asi-history-feature #licensed .copy>p:nth-of-type(1){grid-column:2/4;grid-row:3;max-width:960px;margin:0} #asi-history-feature #licensed .copy>p:nth-of-type(2){grid-column:2/4;grid-row:4;max-width:960px;margin:0 0 22px} #asi-history-feature #licensed .credential-card{grid-column:2;grid-row:5;width:100%;height:100%;margin:0;padding:clamp(22px,2.4vw,34px)} #asi-history-feature #licensed>.pin{grid-column:1;grid-row:1;align-self:start;margin-top:4px} #asi-history-feature #licensed>.visual{grid-column:3;grid-row:5;width:100%;margin:0;align-self:stretch} #asi-history-feature #licensed .construction-transition,#asi-history-feature #licensed .scene-panel{height:100%} #asi-history-feature #licensed .construction-milestone-visual .scene-panel{display:flex;flex-direction:column;justify-content:center;max-width:none;padding:clamp(18px,2vw,28px)} #asi-history-feature #licensed .workplace-build{max-height:610px} #asi-history-feature #licensed .history-video{display:none} #asi-history-feature #licensed .scene-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap} #asi-history-feature #licensed .scene-footer button{margin-left:0} #asi-history-feature #licensed .construction-cta{min-height:44px;padding:10px 18px;font-size:14px;gap:12px} #asi-history-feature #licensed .credential-v5 .credential-heading{margin-bottom:16px} #asi-history-feature #licensed .credential-v5 .credential-heading img{width:min(150px,42%);opacity:.94;filter:brightness(0) saturate(100%) invert(91%) sepia(12%) saturate(319%) hue-rotate(62deg) brightness(104%) contrast(92%)} #asi-history-feature #licensed .credential-v5 .credential-number{margin:10px 0 18px;padding-bottom:15px} #asi-history-feature #licensed .credential-v5 .classification-panel{gap:10px} #asi-history-feature #licensed .credential-v5 .classification-panel a{min-height:126px;padding:16px 10px} #asi-history-feature #licensed .credential-v5 .credential-icon{width:40px;height:40px;margin-bottom:9px} #asi-history-feature #licensed .credential-v5 .classification-panel strong{font-size:clamp(24px,2.2vw,34px)} #asi-history-feature #licensed .credential-v5 .credential-footer{margin-top:14px} @media(min-width:901px){#asi-history-feature #licensed .credential-v5 .classification-panel{grid-template-columns:repeat(2,minmax(0,1fr))!important}} #asi-history-feature .rail-crossing[data-crossing="construction"],#asi-history-feature .rail-gates[data-gates="construction"],#asi-history-feature .road-tunnel{display:none!important} @media(max-width:900px){ #asi-history-feature #licensed{grid-template-columns:26px minmax(0,1fr);grid-template-rows:auto;column-gap:18px;row-gap:16px} #asi-history-feature #licensed .copy>.date,#asi-history-feature #licensed .copy>h2,#asi-history-feature #licensed .copy>p:nth-of-type(1),#asi-history-feature #licensed .copy>p:nth-of-type(2),#asi-history-feature #licensed .credential-card,#asi-history-feature #licensed>.visual{grid-column:2} #asi-history-feature #licensed .copy>.date{grid-row:1}#asi-history-feature #licensed .copy>h2{grid-row:2}#asi-history-feature #licensed .copy>p:nth-of-type(1){grid-row:3}#asi-history-feature #licensed .copy>p:nth-of-type(2){grid-row:4}#asi-history-feature #licensed .credential-card{grid-row:5;margin-top:12px}#asi-history-feature #licensed>.visual{grid-row:6;margin-top:12px} #asi-history-feature #licensed>.pin{grid-column:1;grid-row:1;margin-top:4px} } @media(max-width:520px){ #asi-history-feature #licensed .credential-v5 .classification-panel{grid-template-columns:1fr 1fr} #asi-history-feature #licensed .credential-v5 .classification-panel a{min-height:118px} #asi-history-feature #licensed .credential-v5 .credential-icon{width:34px;height:34px} } #asi-history-feature .milestone .pin,#asi-history-feature .milestone.copy-left .pin,#asi-history-feature .milestone.copy-right .pin,#asi-history-feature .milestone.wide-milestone .pin,#asi-history-feature .milestone.wide-milestone.copy-right .pin{opacity:0!important;box-shadow:none!important;border-color:transparent!important;background:transparent!important} #asi-history-feature .palm-later,#asi-history-feature .palm-companion{display:none!important} #asi-history-feature .programs-motion{display:none!important} #asi-history-feature .pelican-flock{transform-box:view-box;transform-origin:center;animation:asi-pelican-pass 12.8s ease-in-out infinite} @keyframes asi-pelican-pass{0%,8%{opacity:0;transform:translate(-180px,150px) scale(.72)}18%,72%{opacity:.54}88%,100%{opacity:0;transform:translate(900px,75px) scale(.88)}} #asi-history-feature .background-rider{transform-box:fill-box;transform-origin:center;filter:saturate(.72) contrast(.96);animation:asi-background-surf 8.6s ease-in-out infinite} #asi-history-feature .background-rider-b{animation-delay:3.2s;animation-duration:10.4s} /* A softer entrance and exit for the year navigation and continuous road. */ #asi-history-feature .milestone-nav{border:0;border-radius:18px;padding:12px 20px;background:linear-gradient(90deg,rgba(34,36,37,.72),rgba(34,36,37,.98) 12%,rgba(34,36,37,.98) 88%,rgba(34,36,37,.72));box-shadow:0 8px 22px #00000012} #asi-history-feature .milestone-nav a::before{content:none;display:none} #asi-history-feature .route-svg{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 72px,#000 calc(var(--asi-route-end,100%) - 96px),transparent var(--asi-route-end,100%));mask-image:linear-gradient(to bottom,transparent,#000 72px,#000 calc(var(--asi-route-end,100%) - 96px),transparent var(--asi-route-end,100%))} /* The founding map leads directly into the coastal scene without repeated labels. */ #asi-history-feature #founded{padding-bottom:24px} #asi-history-feature #founded .story-art-frame{background:transparent;border:0;border-radius:0;box-shadow:none;clip-path:inset(0 round 2%)} #asi-history-feature #surfing{width:calc(100% - 90px);max-width:1080px;margin:0 0 64px 90px;padding-top:0} #asi-history-feature #surfing .scene-panel{max-width:none;padding-top:0;border:0;background:transparent;box-shadow:none} #asi-history-feature #surfing .bay-scene{max-width:none;border:0;background:transparent;box-shadow:none} @media(max-width:700px){ #asi-history-feature .milestone-nav{padding:8px 12px;border-radius:12px} #asi-history-feature #founded{padding-bottom:16px} #asi-history-feature #surfing{width:calc(100% - 45px);margin:0 0 44px 45px} #asi-history-feature .route-svg{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 40px,#000 calc(var(--asi-route-end,100%) - 64px),transparent var(--asi-route-end,100%));mask-image:linear-gradient(to bottom,transparent,#000 40px,#000 calc(var(--asi-route-end,100%) - 64px),transparent var(--asi-route-end,100%))} } @keyframes asi-background-surf{0%,12%,100%{opacity:.06;translate:20px 5px;rotate:-3deg}28%{opacity:.24;translate:9px -3px;rotate:-7deg}52%{opacity:.27;translate:-19px 1px;rotate:5deg}72%{opacity:.15;translate:-45px 6px;rotate:1deg}84%{opacity:.04;translate:-58px 9px;rotate:0}} /* 2021: a shared introduction above two balanced, readable proof panels. */ #asi-history-feature #licensed { grid-template-columns: 28px minmax(0, .94fr) minmax(0, 1.06fr); column-gap: clamp(22px, 2.6vw, 40px); row-gap: 18px; } #asi-history-feature #licensed .copy > .date, #asi-history-feature #licensed .copy > h2, #asi-history-feature #licensed .copy > p:nth-of-type(1), #asi-history-feature #licensed .copy > p:nth-of-type(2) { grid-column: 2 / 4; } #asi-history-feature #licensed .credential-card { grid-column: 2; grid-row: 5; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: clamp(20px, 2.2vw, 30px); overflow: visible; } #asi-history-feature #licensed > .visual { grid-column: 3; grid-row: 5; min-width: 0; margin: 0; } #asi-history-feature #licensed .credential-v5 .credential-heading img { width: clamp(140px, 38cqi, 172px); max-width: 100%; height: auto; max-height: 82px; opacity: 1; } #asi-history-feature #licensed .credential-v5 .credential-heading > span { font-size: 12px; line-height: 1.5; letter-spacing: .055em; } #asi-history-feature #licensed .credential-v5 .credential-number { margin: 4px 0 20px; padding-bottom: 0; } #asi-history-feature #licensed .credential-v5 .classification-panel { flex: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } #asi-history-feature #licensed .credential-v5 .classification-panel a { min-height: 164px; padding: 18px 10px; gap: 8px; align-content: center; grid-template-rows: auto auto auto; overflow: visible; } #asi-history-feature #licensed .credential-v5 .credential-icon { width: 56px; height: 56px; margin: 0 auto 4px; } #asi-history-feature #licensed .credential-v5 .classification-panel strong { font-size: clamp(20px, 5.4cqi, 27px); line-height: 1.2; } #asi-history-feature #licensed .credential-v5 .classification-panel a > span { display: block; min-height: 2.8em; font-size: 13px; line-height: 1.4; text-align: center; text-wrap: balance; } #asi-history-feature #licensed .credential-v5 .credential-footer { margin-top: 20px; font-size: 12px; } #asi-history-feature #licensed .construction-milestone-visual .scene-panel { justify-content: flex-start; padding: clamp(20px, 2.2vw, 30px); border-radius: 14px; } #asi-history-feature #licensed .construction-milestone-visual .eyebrow { align-self: center; margin-bottom: 12px; font-size: 12px; text-align: center; } #asi-history-feature #licensed .workplace-build { flex: 1 1 auto; min-height: 0; max-height: 560px; } #asi-history-feature #licensed .build-caption { margin-top: 16px; text-align: center; } #asi-history-feature #licensed .build-caption h3 { font-size: clamp(25px, 2.3vw, 32px); line-height: 1.16; } #asi-history-feature #licensed .scene-footer { justify-content: center; gap: 14px; } @media (max-width: 800px) { #asi-history-feature #licensed { grid-template-columns: 26px minmax(0, 1fr); column-gap: 18px; } #asi-history-feature #licensed .copy > .date, #asi-history-feature #licensed .copy > h2, #asi-history-feature #licensed .copy > p:nth-of-type(1), #asi-history-feature #licensed .copy > p:nth-of-type(2), #asi-history-feature #licensed .credential-card, #asi-history-feature #licensed > .visual { grid-column: 2; } #asi-history-feature #licensed > .visual { grid-row: 6; margin-top: 8px; } #asi-history-feature #licensed .workplace-build { flex: none; max-height: none; } #asi-history-feature #licensed .scene-footer { flex-direction: row; } } @media (max-width: 480px) { #asi-history-feature #licensed .credential-card, #asi-history-feature #licensed .construction-milestone-visual .scene-panel { padding: 20px 14px; } #asi-history-feature #licensed .credential-v5 .classification-panel a { padding: 16px 8px; } #asi-history-feature #licensed .credential-v5 .classification-panel a > span { font-size: 12px; } } @media (max-width: 380px) { #asi-history-feature #licensed .credential-v5 .classification-panel { grid-template-columns: 1fr; } #asi-history-feature #licensed .credential-v5 .classification-panel a { display: grid; grid-template-columns: 42px minmax(0, 1fr); grid-template-rows: auto auto; min-height: 92px; padding: 12px 8px; column-gap: 10px; row-gap: 4px; align-items: center; text-align: left; } #asi-history-feature #licensed .credential-v5 .credential-icon { grid-column: 1; grid-row: 1 / 3; width: 42px; height: 42px; margin: 0; } #asi-history-feature #licensed .credential-v5 .classification-panel strong { grid-column: 2; grid-row: 1; text-align: left; } #asi-history-feature #licensed .credential-v5 .classification-panel a > span { min-height: 0; font-size: 13px; grid-column: 2; grid-row: 2; text-align: left; text-wrap: initial; } } /* Keep the wave and rider on one scene clock. */ #asi-history-feature .surf-wave-drift, #asi-history-feature .surf-rider-carve { animation:none; transform:none; } #asi-history-feature .pelican-flock { animation-play-state:paused; } #asi-history-feature #surfing[data-playback="playing"] .pelican-flock { animation-play-state:running; } #asi-history-feature[data-motion="paused"] .pelican-flock { animation-play-state:paused; } #asi-history-feature #surfing .scene-footer { border-top:0; padding-top:10px; } #asi-history-feature #surfing .scene-panel { padding-bottom:0; } #asi-history-feature .milestone-nav a:focus-visible { outline:2px solid #bdd1c1; outline-offset:2px; } #asi-history-feature .next-stop > .pin { opacity:0; background:transparent; border:0; box-shadow:none; } @media(prefers-reduced-motion:reduce) { #asi-history-feature .pelican-flock { animation:none; } } /* Give National Delivery, the tunnel, and the next milestone separate road space. */ #asi-history-feature .timeline { --asi-tunnel-height:226px; --asi-tunnel-clearance:clamp(140px,12vw,200px); } #asi-history-feature #markets { padding-bottom:0; } #asi-history-feature .tunnel-transition { display:block; height:calc(var(--asi-tunnel-height) + var(--asi-tunnel-clearance) * 2); margin:0; padding:0; pointer-events:none; } #asi-history-feature .road-tunnel { display:block!important; height:var(--asi-tunnel-height); transition:none!important; } #asi-history-feature .route-svg path { transition:none!important; } #asi-history-feature #licensed { margin-top:0; padding-top:0; } @media(max-width:700px) { #asi-history-feature .timeline { --asi-tunnel-height:144px; --asi-tunnel-clearance:clamp(112px,24vw,156px); } } /* Delivery assembly uses clipped pieces of the existing illustration. */ #asi-history-feature #foundation .story-art-frame { position: relative !important; display: block !important; aspect-ratio: 3 / 2 !important; height: auto !important; padding: 0 !important; overflow: hidden !important; isolation: isolate; } #asi-history-feature #foundation .story-art-frame > img { position: absolute !important; inset: 0 !important; display: block !important; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; margin: 0 !important; object-fit: contain !important; animation: none !important; transition: none !important; opacity: 1 !important; visibility: visible !important; filter: none !important; transform: none !important; } #asi-history-feature #foundation[data-delivery-drop] .delivery-motion { position: absolute !important; inset: 0 !important; display: block !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; z-index: 2; overflow: hidden !important; pointer-events: none; visibility: hidden !important; filter: none !important; backdrop-filter: none !important; transform: none !important; background: none !important; } #asi-history-feature #foundation .delivery-motion::before, #asi-history-feature #foundation .delivery-motion > i { display: none !important; animation: none !important; } #asi-history-feature #foundation[data-delivery-drop] .delivery-drop-canvas { position: absolute !important; inset: 0 !important; display: block !important; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0 !important; overflow: hidden !important; filter: none !important; transform: none !important; } #asi-history-feature #foundation[data-delivery-state="ready"] .delivery-motion, #asi-history-feature #foundation[data-delivery-state="playing"] .delivery-motion, #asi-history-feature #foundation[data-delivery-state="paused"] .delivery-motion { visibility: visible !important; } #asi-history-feature #foundation[data-delivery-state="loading"] .story-art-frame > img, #asi-history-feature #foundation[data-delivery-state="ready"] .story-art-frame > img, #asi-history-feature #foundation[data-delivery-state="playing"] .story-art-frame > img, #asi-history-feature #foundation[data-delivery-state="paused"] .story-art-frame > img { opacity: 0 !important; visibility: hidden !important; } @media (prefers-reduced-motion: reduce) { #asi-history-feature:not([data-motion="active"]) #foundation[data-delivery-drop] .delivery-motion { visibility: hidden !important; } #asi-history-feature:not([data-motion="active"]) #foundation[data-delivery-drop] .story-art-frame > img { opacity: 1 !important; visibility: visible !important; } }