/*--------------------------------------------------------------
# Landing page (/test1): the new public homepage blueprint.
# Everything is nested under .alma-landing (native CSS nesting) so none of it reaches the rest of
# the site, and the site's own header sits above it unchanged. The blueprint's own header, top line
# and bottom section navigation are gone: the site header (Views/Shared/_HeaderPartial) replaces the
# first, the topbar partial is dropped, and sections are reached from the header menu, the in-page
# buttons, the arrow keys and the address hash (landing.js).
--------------------------------------------------------------*/
.alma-landing{
--navy:#172b45;--blue:#304f7f;--surface:#1e3553;--ice:#e6f1fc;--muted:#a4b7cf;--aqua:#7bddd9;--header:72px;--label-font:monospace;
background:var(--navy);color:var(--ice);font-family:Arial,Helvetica,sans-serif;
*{box-sizing:border-box}
/* The site's own element rules (section padding, Roboto headings, link colours) stop at the wrapper. */
section{padding:0}
h1,h2,h3,h4{font-family:inherit}
button{font:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
a:hover{color:inherit}
button:focus-visible,a:focus-visible{outline:2px solid var(--aqua);outline-offset:6px}
.stage{height:calc(100svh - var(--header));min-height:0;position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#fff 0%,#f0f7fd 16%,#cee3f4 46%,#a3c4dd 62%,#6a93b5 76%,#2f5379 86%,#172b45 100%)}
.sea{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.grain{position:absolute;inset:0;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}
.chart-label{font:12px var(--label-font);letter-spacing:2px;fill:#b5c8df;opacity:.55}
.panels{position:absolute;left:7vw;top:18%;width:min(580px,45vw);bottom:72px}
.panel{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transform:translateY(22px);transition:opacity .5s,transform .65s cubic-bezier(.16,1,.3,1),visibility .5s;pointer-events:none}
.panel.active{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.eyebrow{font:12px var(--label-font);letter-spacing:3px;color:var(--aqua);margin:0 0 22px;text-transform:uppercase}
h1,h2{font-weight:500;letter-spacing:-.055em;line-height:1.02;margin:0 0 24px;font-size:clamp(42px,5.4vw,86px);color:inherit}
h1 em,h2 em{font-style:normal;color:#94b5df}
p{font-size:17px;line-height:1.7;color:#bacbdf;max-width:430px;margin:0 0 26px}
.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.primary,.secondary{padding:14px 21px;border-radius:4px;font-size:14px;transition:background .2s}
.primary{border:1px solid #839cbe;background:var(--blue);color:white}
.primary:hover{background:#3e6397;color:white}
.secondary{border:1px solid #8198b14d;background:#172b4544;color:var(--ice)}
.secondary:hover{background:#304f7f55}
.mini{margin-top:32px;display:flex;gap:24px;color:var(--muted);font:12px var(--label-font);letter-spacing:1px}
.mini span{border-top:1px solid #758aa44d;padding-top:12px}
.hint{position:absolute;right:7vw;bottom:112px;font:12px var(--label-font);letter-spacing:1px;color:#acc6df}
.hint span{color:var(--aqua)}
.service-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.service{border-top:1px solid #a2bad64d;padding:16px 0}
.service b{font-weight:500;display:block;font-size:17px;margin:0 0 8px}
.service p{font-size:14px;line-height:1.5;margin:0}
.service .num{font:11px var(--label-font);color:var(--aqua);display:block;margin-bottom:10px}
.panel:not(#home) h2{font-size:clamp(36px,4vw,60px)}
.history-line{display:flex;align-items:center;gap:20px;margin:8px 0 24px;font:14px var(--label-font)}
.history-line i{height:1px;flex:1;background:linear-gradient(90deg,var(--aqua),#91b7df22)}
.history-line span:first-child{color:var(--aqua)}
.portal-features{display:flex;gap:8px;margin:0 0 28px;flex-wrap:wrap}
.portal-features span{border:1px solid #8bacc53d;padding:9px 12px;font-size:13px;background:#172b454d}
.contact-links{display:grid;gap:14px}
.contact-links a{font-size:22px;letter-spacing:-.02em;border-bottom:1px solid #8bacc54d;padding-bottom:12px;width:fit-content}
.contact-links a:hover{color:var(--aqua)}
.address{font-size:14px;margin-top:22px}
.landing-footer{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;align-items:center;justify-content:flex-start;padding:0 4vw;height:52px;color:#d6e8f4;font-size:13px;letter-spacing:.02em}
.landing-footer .contacts{display:flex;align-items:center;gap:24px;min-width:0}
.landing-footer a,.landing-footer button{color:#d6e8f4}
.landing-footer a:hover,.landing-footer button:hover{color:#fff}
.landing-footer .contacts>a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.landing-footer .contacts i{font-size:15px;color:var(--aqua)}
.landing-footer .lang-switch{margin:0;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.landing-footer .lang-switch button{padding:0 2px;border:0;background:none;font-weight:700;color:var(--aqua);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px}
.landing-footer .lang-switch button:hover{color:#fff}
.landing-footer .terms{white-space:nowrap}
.landing-footer .terms:hover{text-decoration:underline}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

@media(min-width:1500px){.panels{left:10vw}}
@media(max-width:850px){.panels{left:6vw;width:53vw}.hint{right:5vw}.mini{gap:14px}}
@media(max-width:600px){.panels{left:7vw;top:70px;width:86vw;bottom:172px}.panel{justify-content:flex-start}h1{font-size:clamp(43px,11vw,65px);max-width:320px;margin-bottom:18px}.panel:not(#home) h2{font-size:38px;margin-bottom:18px}.eyebrow{margin-bottom:16px;font-size:11px}p{font-size:15px;line-height:1.55;max-width:330px;margin-bottom:19px}.primary,.secondary{padding:12px 15px;font-size:13px}.mini{display:none}.hint{right:6vw;bottom:77px;font-size:10px;max-width:175px;text-align:right}.service-list{gap:8px 18px}.service{padding:10px 0}.service b{font-size:15px}.service p{font-size:13px}.service .num{margin-bottom:7px}.contact-links a{font-size:21px}.address{max-width:230px}.history-line{margin-top:0}.portal-features{gap:6px;margin-bottom:18px}.portal-features span{font-size:12px}}
@media(max-height:700px) and (min-width:601px){.panels{top:16%;bottom:72px}h1{font-size:62px}.eyebrow{margin-bottom:14px}p{margin-bottom:18px;font-size:15px}.mini{display:none}.panel:not(#home) h2{font-size:42px}.service{padding:10px 0}}
@media(max-height:680px) and (max-width:600px){.panels{top:55px;bottom:125px}h1{font-size:42px}.panel:not(#home) h2{font-size:31px}.eyebrow{margin-bottom:12px}p{font-size:14px}.service p{font-size:12px}.service b{font-size:14px}.history-line{margin-bottom:12px}.portal-features span{padding:7px}.contact-links{gap:9px}.address{margin-top:12px}.hint{display:none}}
@media(prefers-reduced-motion:reduce){.panel{transition:none}}

.logistics-scene{position:absolute;right:2vw;top:9%;width:48vw;height:76%;pointer-events:none;z-index:-1}
.logistics-scene>svg{width:100%;height:100%;overflow:visible}
.network{transform-origin:center;will-change:transform}
.route-line{fill:none;stroke:#729ac0;stroke-width:1.1;opacity:.4}
.route-main{fill:none;stroke:#8acdcf;stroke-width:1.5;opacity:.42}
.route-track{fill:none;stroke:#99d4df;stroke-width:.8;stroke-dasharray:2 9;opacity:.35}
.hub-ring{fill:#18324ed9;stroke:#91bcd0;stroke-opacity:.45;stroke-width:1}
.hub .hub-core{fill:#7394b3;transition:fill .4s}
.hub.lit .hub-core{fill:#c3fff0}
.hub.lit .hub-ring{stroke:#a9e9dd;stroke-opacity:.9}
.network-label{font:12px var(--label-font);letter-spacing:2px;fill:#b9cfe0}
.network-caption{font:11px var(--label-font);letter-spacing:2px;fill:#7998b5}
.delivery-label{font:22px Arial,sans-serif;letter-spacing:3px;fill:#d8f5f4}
.orbit{fill:none;stroke:#9ec9d4;stroke-width:.6;opacity:.22}
.cargo-marker{fill:#c2ede6;stroke:#eafff8;stroke-width:1;filter:url(#cargo-glow)}
.arrival-ring{fill:none;stroke:#a0e4d9;stroke-width:1}
.panels{width:min(580px,43vw)}
h1{font-size:clamp(42px,5vw,80px)}
@media(max-width:1000px) and (min-width:601px){.hint{right:4vw}.logistics-scene{right:0;width:50vw}.panels{width:47vw}}
@media(max-width:600px){.logistics-scene{right:-9vw;top:auto;bottom:65px;width:66vw;height:33%;opacity:.55}.panels{width:86vw}.hint{max-width:180px;bottom:80px}.network-label{font-size:15px;letter-spacing:1px}.network-caption{display:none}h1{font-size:clamp(43px,11vw,65px)}.delivery-label{font-size:23px}}
@media(max-height:700px) and (min-width:601px){h1{font-size:54px}.hint{display:none}.logistics-scene{top:7%;height:70%}}
@media(max-height:680px) and (max-width:600px){h1{font-size:39px;line-height:1}.logistics-scene{height:30%;bottom:66px}}

/* White header, open sky and deep sea share one continuous colour field. */
.stage{color:#172b45}
.panels .eyebrow,.service .num,.history-line span:first-child{color:#304f7f}
h1 em,h2 em{color:#304f7f}
.panels p{color:#233e5c}
.panels .secondary{color:#172b45;background:#ffffff70;border-color:#304f7f55}
.panels .secondary:hover{background:#ffffffa6}
.mini{color:#233e5c}
.mini span,.service{border-color:#304f7f40}
.history-line i{background:linear-gradient(90deg,#304f7f,#304f7f33)}
.portal-features span{background:#ffffff50;color:#172b45;border-color:#304f7f40}
.contact-links a{border-color:#304f7f50}
.contact-links a:hover{color:#304f7f}
.route-line{stroke:#304f7f;opacity:.42}
.route-main{stroke:#304f7f;opacity:.6}
.route-track{stroke:#304f7f;opacity:.4}
.network-label{fill:#233e5c}
.network-caption{fill:#496585}
.hub[data-hub="2"] .network-label,.hub[data-hub="2"] .network-caption{fill:#e6f1fc}
.delivery-label{fill:#172b45}
.hub[data-hub="3"] .network-caption{fill:#e6f1fc}
.orbit{stroke:#304f7f;opacity:.3}
.hub-ring{fill:#304f7fe0;stroke:#304f7f;stroke-opacity:.5}
.hint{color:#d6e8f4}
@media(max-width:600px){.stage{background:linear-gradient(180deg,#fff 0%,#f0f7fd 16%,#cee3f4 52%,#a3c4dd 70%,#6a93b5 83%,#2f5379 92%,#172b45 100%)}.logistics-scene{opacity:.65}}

@media(min-width:851px){.panels{top:max(78px,calc(18% - 72px));transform:none}.panel{justify-content:flex-start}.panels p{margin-bottom:18px}.mini{margin-top:22px}}
@media(max-width:850px){.extended-copy{display:none}.service p{font-size:13px;line-height:1.45}}
@media(max-height:740px){.extended-copy{display:none}}
@media(max-width:600px){.panels{top:36px}.panels p{margin-bottom:15px}.panel:not(#home) h2{font-size:34px}html[lang=el] & h1{font-size:clamp(36px,10vw,52px)}.service{padding:8px 0}.service p{font-size:12px}.eyebrow{letter-spacing:2px}}
@media(max-height:700px) and (min-width:851px){.panels{top:66px}}
@media(max-height:680px) and (max-width:600px){.panels{top:24px}.panel:not(#home) h2{font-size:29px}.service .num{margin-bottom:4px}.service b{margin-bottom:5px}.panels p{font-size:13px;line-height:1.45;margin-bottom:12px}}

/* Multi-path delivery diagram and the alternate contact surface. */
.logistics-scene{top:2%;right:1vw;width:51vw;height:82%;transition:opacity .35s,visibility .35s}
.network-label{font-size:13px;letter-spacing:1.3px}
.network-caption{font-size:10px;letter-spacing:1.3px}
.node-icon{fill:none;stroke:#e6f1fc;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.hub-vendor .hub-ring{fill:#304f7f;stroke:#7bddd9;stroke-width:1.5}
.hub-port .network-label,.hub-customs[data-hub="6"] .network-label,.hub-customs[data-hub="6"] .network-caption,.hub-board .network-caption{fill:#e6f1fc}
.hub-road .network-label,.hub-sea .network-label{fill:#233e5c}
.journey-path{fill:none;stroke:#7bddd9;stroke-width:2.2;opacity:0;transition:opacity .4s}
.journey-path.active-route{opacity:.55}
.freight-leg{stroke-dasharray:2 7;stroke-linecap:round;stroke-width:1.4;opacity:.55}
.contact-draft{position:absolute;right:5vw;top:78px;bottom:110px;width:min(580px,44vw);padding:25px 28px;background:#f5faffed;border:1px solid #ffffff90;border-radius:12px;box-shadow:0 24px 70px #172b4520;overflow-y:auto;scrollbar-width:thin;opacity:0;visibility:hidden;transform:translateY(18px);transition:opacity .35s,transform .35s,visibility .35s;z-index:3;color:#172b45}
.stage.contact-active .contact-draft{opacity:1;visibility:visible;transform:none}
.stage.contact-active .logistics-scene{opacity:0;visibility:hidden}
.stage.contact-active .hint{display:none}
.draft-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}
.draft-header h3{margin:0;font-size:24px;font-weight:500;letter-spacing:-.03em}
.draft-badge{font:11px var(--label-font);letter-spacing:2px;color:#496585}
.form-tabs{display:flex;gap:5px;border-bottom:1px solid #304f7f33;margin-bottom:20px}
.form-tabs button{flex:1;border:0;border-bottom:2px solid transparent;background:none;color:#496585;padding:12px 5px;font-size:14px}
.form-tabs button[aria-selected=true]{color:#304f7f;border-bottom-color:#304f7f;font-weight:700}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px}
.contact-draft label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:#233e5c;margin:0}
.contact-draft input,.contact-draft select,.contact-draft textarea{width:100%;min-width:0;border:1px solid #304f7f40;border-radius:5px;background:#fff;color:#172b45;font:16px Arial,sans-serif;padding:10px 11px}
.contact-draft textarea{resize:vertical;min-height:72px}
.contact-draft input:focus,.contact-draft select:focus,.contact-draft textarea:focus{outline:2px solid #304f7f;outline-offset:1px}
.contact-draft .wide{margin-top:16px}
.draft-submit{margin-top:17px}
.contact-draft p{font-size:12px;line-height:1.5;margin:13px 0 0;color:#496585;max-width:none}
.contact-draft .form-status{color:#304f7f;font-weight:600}
.form-panel[hidden]{display:none}
@media(max-height:740px) and (min-width:601px){.contact-draft{top:55px;bottom:93px;padding:18px 23px}.form-grid{gap:10px 13px}.contact-draft input,.contact-draft select{padding:8px 10px}.form-tabs{margin-bottom:13px}.draft-header{margin-bottom:10px}}
@media(max-width:850px) and (min-width:601px){.contact-draft{width:45vw;right:3vw;padding:20px}.logistics-scene{width:51vw;right:0}}
@media(max-width:600px){.logistics-scene{right:-14vw;top:auto;bottom:70px;width:80vw;height:34%;opacity:.65}.contact-draft{top:117px;left:6vw;right:6vw;bottom:125px;width:auto;padding:17px 18px;border-radius:10px}.stage.contact-active #contact .eyebrow,.stage.contact-active #contact p,.stage.contact-active #contact .contact-links{display:none}.stage.contact-active #contact h2{font-size:25px;line-height:1.1;max-width:100%;margin:0}.stage.contact-active .panels{top:28px}.form-tabs{margin-bottom:15px}.draft-header{margin-bottom:10px}.draft-header h3{font-size:20px}.form-grid{gap:11px}.contact-draft label{font-size:12px}.contact-draft input,.contact-draft select{padding:8px;font-size:16px}.contact-draft .wide{margin-top:12px}.draft-submit{margin-top:12px;padding:11px 15px}.contact-draft textarea{min-height:65px}.network-label{font-size:15px;letter-spacing:1px}.network-caption{display:none}}
@media(prefers-reduced-motion:reduce){.logistics-scene,.contact-draft,.journey-path{transition:none}}

/* Compact frosted-glass contact surface. */
.contact-draft{width:min(540px,42vw);height:auto;bottom:auto;max-height:calc(100% - 188px);padding:20px 23px;background:linear-gradient(135deg,#ffffffb0,#edf6ff63);backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%);border:1px solid #ffffffb8;border-radius:16px;box-shadow:0 20px 65px #172b4526,inset 0 1px 0 #ffffffd9,inset 0 -1px 0 #ffffff40}
.draft-header{margin-bottom:11px}
.draft-header h3{font-size:22px}
.draft-badge{font-size:10px}
.form-tabs{margin-bottom:15px;gap:8px;border-bottom:0;padding:4px;background:#ffffff35;border:1px solid #ffffff66;border-radius:9px}
.form-tabs button{padding:9px 5px;border:0;border-radius:6px}
.form-tabs button[aria-selected=true]{background:#ffffff80;box-shadow:0 2px 8px #172b4510;color:#304f7f}
.form-grid{gap:10px 14px}
.contact-draft label{gap:5px;font-size:13px}
.contact-draft input,.contact-draft select,.contact-draft textarea{background:#ffffff91;border-color:#ffffffb8;border-radius:7px;padding:8px 10px;box-shadow:inset 0 1px 2px #172b4505}
.contact-draft .wide{margin-top:12px}
.contact-draft textarea{min-height:65px}
.draft-submit{margin-top:13px;padding:11px 17px;border-radius:7px}
.contact-draft p{margin-top:10px}
@media(max-width:850px) and (min-width:601px){.contact-draft{width:45vw;padding:17px 19px}}
@media(max-height:740px) and (min-width:601px){.contact-draft{max-height:calc(100% - 148px);padding:16px 20px}.form-tabs{margin-bottom:12px}}
@media(max-width:600px){.contact-draft{width:auto;bottom:auto;max-height:calc(100% - 242px);padding:15px 17px}.draft-header h3{font-size:20px}.form-grid{gap:9px 11px}.contact-draft input,.contact-draft select{font-size:16px}.contact-draft textarea{min-height:60px}}

.moving-vehicle{fill:none;stroke:#f5fffd;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.vehicle-halo{fill:#304f7fe0;stroke:#c6e9ed66;stroke-width:.7}
.hub-customs[data-hub="6"] .network-label,.hub-customs[data-hub="6"] .network-caption{fill:#233e5c}
@media(max-width:600px){.hint{display:block;right:6vw;bottom:77px;font-size:10px;max-width:175px}}
@media(max-height:680px){.hint{display:none}}
.hub-air .network-label,.hub-road .network-label{paint-order:stroke;stroke:#d9e9f5;stroke-width:4px;stroke-linejoin:round}
.hub-sea .network-label{paint-order:stroke;stroke:#aac9df;stroke-width:4px;stroke-linejoin:round}
.route-main,.freight-leg,.journey-path{stroke-linecap:round;stroke-linejoin:round}
.moving-vehicle{stroke:#172b45;stroke-width:2;filter:drop-shadow(0 1px 1px #ffffff88)}
.moving-vehicle[data-vehicle="package"]{stroke:#f5fffd;filter:none}
.vehicle-halo{fill:#304f7fe0;stroke:#c6e9ed66}
#vendor-order{pointer-events:none}

.route-metric{fill:none;stroke:none;opacity:0}
.hub .hub-ring{fill:#304f7f}
.working-dots{fill:#b3ece6;pointer-events:none}
.hub.processing .hub-core{opacity:0}
.hub.processing .node-icon{opacity:.55}
.hub .node-icon,.hub .hub-core{transition:opacity .2s}
.moving-vehicle{stroke:#172b45;stroke-width:1.4;filter:drop-shadow(1px 2px 1px #172b4528)}
.moving-vehicle[data-vehicle="package"]{stroke:#e8f3fd}

.station-label .network-label{fill:#233e5c;stroke:none;paint-order:normal}
.station-label .network-caption{fill:#496585}
.station-label[data-label-hub="7"] .network-label,.station-label[data-label-hub="8"] .network-caption{fill:#172b45}
.station-label[data-label-hub="1"] .network-label,.station-label[data-label-hub="2"] .network-label{fill:#172b45}

/* Give the diagram its own desktop Services view. */
.logistics-scene,.hint{display:none}
@media(min-width:1024px){.stage.services-active .logistics-scene,.stage.services-active .hint{display:block}}
@media(min-width:601px){.stage.wide-panel .panels{width:min(1100px,80vw)}.stage.wide-panel .panel p{max-width:760px}.stage.wide-panel .history-line{max-width:760px}.stage.wide-panel #home h1{max-width:1050px}}
@media(min-width:601px) and (max-width:1023px){.stage.services-active .panels{width:86vw}}
.mobile-break{display:none}
.desktop-space{display:inline}
@media(max-width:600px){.mobile-break{display:inline}.desktop-space{display:none}}

#home .mini{width:345px;max-width:100%;gap:12px;justify-content:space-between;font-size:9px;letter-spacing:.65px}
#home .mini span{white-space:nowrap}
#history{overflow-y:auto;scrollbar-width:thin;padding-right:12px}
#history p{font-size:16px;line-height:1.55}
@media(max-width:600px){#home .extended-copy{display:block}#home,#history{overflow-y:auto;scrollbar-width:thin}#history p{font-size:14px;line-height:1.55}}

.portal-preview{position:absolute;left:calc(100% + 3vw);top:50%;transform:translateY(-50%);width:44vw;max-width:740px;color:#172b45;pointer-events:auto}
.preview-caption{display:flex;justify-content:space-between;align-items:center;margin:0 0 12px;font-size:14px;color:#304f7f}
.preview-caption small{font-size:12px}
.preview-tabs{display:flex;gap:4px;flex-wrap:wrap;margin:0 0 12px}
.preview-tabs button{font-size:12px;border:1px solid #304f7f30;border-radius:6px;background:#ffffff66;color:#304f7f;padding:8px 10px}
.preview-tabs button[aria-selected=true]{background:#304f7f;color:white;border-color:#304f7f}
.preview-window{background:#f7faff;border:1px solid #ffffffb0;border-radius:12px;overflow:hidden;box-shadow:0 22px 70px #172b4530;transform:perspective(1500px) rotateY(-3deg)}
.preview-chrome{display:flex;gap:18px;align-items:center;background:#304f7f;color:white;padding:15px 20px;font-size:12px}
.preview-wordmark{font-size:20px;font-weight:800;letter-spacing:-1px}
.preview-avatar{margin-left:auto;border:1px solid #ffffff66;border-radius:50%;width:28px;height:28px;display:grid;place-items:center;font-size:10px}
.preview-screen{padding:22px;min-height:345px}
.preview-screen[hidden]{display:none}
.preview-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:20px}
.preview-heading h3{font-size:20px;font-weight:500;letter-spacing:-.5px;margin:0}
.preview-heading>span{font-size:11px;color:#64768d}
.preview-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}
.preview-stat{padding:14px;background:#eaf0f7;border:1px solid #dde6f0;border-radius:7px;display:flex;flex-direction:column;gap:10px}
.preview-stat>span{font-size:11px;color:#63758d}
.preview-stat strong{font-size:23px;font-weight:500}
.preview-two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.preview-screen h4{font-size:12px;font-weight:600;margin:0 0 12px}
.preview-bars{height:80px;display:flex;gap:8px;align-items:flex-end;border-bottom:1px solid #dce5ee;padding:0 8px}
.preview-bars i{flex:1;height:var(--bar);background:linear-gradient(#6e97c8,#304f7f);border-radius:3px 3px 0 0}
.preview-axis{display:flex;justify-content:space-between;font-size:9px;color:#64768d;margin-top:6px}
.preview-event{font-size:11px;display:grid;grid-template-columns:1fr auto;gap:5px;margin:10px 0}
.preview-event>span{grid-column:1}
.preview-event .preview-status{grid-column:2;grid-row:1 / span 2;align-self:center}
.preview-table-wrap{overflow-x:auto}
.preview-screen table{border-collapse:collapse;width:100%;font-size:11px;white-space:nowrap}
.preview-screen th{color:#63758d;text-align:left;font-weight:500;padding:11px 8px;border-bottom:1px solid #cfdbe7;background:#edf2f8}
.preview-screen td{padding:13px 8px;border-bottom:1px solid #e4ebf2}
.preview-screen td small{display:block;color:#6b7b90;font-size:10px;margin-top:4px}
.preview-status{display:inline-block;background:#d9eee9;color:#296959;font-size:10px;padding:5px 7px;border-radius:4px}
.preview-filter{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;font-size:12px}
.preview-filter>span{border:1px solid #d9e3ee;border-radius:5px;padding:8px;color:#7a899c;font-size:10px}
.preview-note{font-size:11px;line-height:1.5;color:#6b7b90;margin-top:14px}
.preview-journey{padding:16px;border:1px solid #dce6f0;border-radius:7px;margin-bottom:16px}
.preview-progress{display:flex;justify-content:space-between;position:relative;font-size:10px;margin:24px 0 8px}
.preview-progress:before{content:'';position:absolute;left:15px;right:15px;top:-11px;height:2px;background:#c9d7e6}
.preview-progress span{position:relative}
.preview-progress span:before{content:'';position:absolute;top:-15px;left:50%;width:10px;height:10px;border-radius:50%;background:#c9d7e6}
.preview-progress .done:before{background:#304f7f}
.preview-document{margin-top:22px;padding:14px;border:1px solid #dce6f0;border-radius:7px;display:flex;align-items:center;gap:12px;font-size:11px}
.preview-file{padding:10px 7px;background:#e2ebf5;color:#304f7f;font-weight:600}
.preview-document small{display:block;color:#6b7b90;margin-top:5px;font-size:10px}
.preview-document>span:last-child{margin-left:auto;white-space:nowrap}
.preview-costs{margin-top:20px}
.preview-costs>div{display:flex;align-items:center;gap:12px;font-size:10px;margin:9px 0}
.preview-costs span{width:65px}
.preview-costs i{width:var(--cost);max-width:70%;height:7px;background:#658dc6;border-radius:2px}
@media(max-width:1023px){.stage.portal-active .panels{width:86vw}#portal{display:block;overflow-y:auto;scrollbar-width:thin;padding-right:10px}.portal-preview{position:relative;left:auto;top:auto;transform:none;width:100%;max-width:720px;margin:24px 0}.preview-window{transform:none}.preview-screen{min-height:0}}
@media(max-width:600px){.preview-screen{padding:14px}.preview-tabs button{font-size:11px;padding:7px 8px}.preview-stats{gap:6px}.preview-stat{padding:10px}.preview-stat strong{font-size:19px}.preview-stat>span{font-size:10px}.preview-two{gap:10px}.preview-heading h3{font-size:18px}.preview-caption{font-size:12px}.preview-chrome{padding:12px 14px}.preview-heading>span{font-size:10px}}
#history{justify-content:flex-start}
#home .extended-copy{display:block}
@media(max-height:740px){#home{justify-content:flex-start;overflow-y:auto;scrollbar-width:thin}}

/* Compact, equally sized desktop portal illustrations. */
.portal-preview{width:37vw;max-width:600px;left:calc(100% + 4vw)}
.preview-window{height:390px;transform:none}
.preview-screen{height:390px;min-height:0;overflow-y:auto;scrollbar-width:thin;padding:18px}
.preview-heading{margin-bottom:14px}
.preview-heading h3{font-size:18px}
.preview-stats{margin-bottom:14px}
.preview-stat{padding:11px;gap:7px}
.preview-stat strong{font-size:21px}
.preview-two{margin-bottom:12px;gap:12px}
.preview-screen th{padding:8px}
.preview-screen td{padding:10px 8px}
.preview-tabs{gap:5px}
.preview-tabs button{padding:7px 9px;font-size:11px}
@media(max-width:1023px){.portal-preview{display:none}}

.preview-window,.preview-screen{height:360px}
.preview-screen{overflow:visible;padding:15px}
.preview-tabs{flex-wrap:nowrap;gap:4px}
.preview-tabs button{white-space:nowrap;font-size:10px;padding:7px 8px}
.preview-heading{margin-bottom:10px}
.preview-heading h3{font-size:17px}
.preview-heading>span{font-size:10px}
.preview-stats{gap:7px;margin-bottom:10px}
.preview-stat{padding:9px;gap:5px}
.preview-stat>span{font-size:10px}
.preview-stat strong{font-size:20px}
.preview-two{gap:10px;margin-bottom:8px}
.preview-screen h4{margin-bottom:8px;font-size:11px}
.preview-bars{height:48px;gap:6px}
.preview-axis{margin-top:4px}
.preview-event{margin:5px 0;gap:3px;font-size:10px}
.preview-status{padding:4px 5px;font-size:9px}
.preview-screen table{font-size:10px}
.preview-screen th{padding:7px 6px}
.preview-screen td{padding:8px 6px}
.preview-screen td small{font-size:9px}
.preview-table-wrap{overflow:visible}
.preview-filter{margin-bottom:10px;font-size:11px}
.preview-filter>span{padding:7px;font-size:9px}
.preview-note{margin-top:10px;font-size:10px}
.preview-journey{padding:12px;margin-bottom:10px}
.preview-progress{margin-top:20px}
.preview-costs{margin-top:12px}
.preview-costs>div{margin:7px 0}

/* Stable top anchors and a shared glass surface for Contact and Portal. */
.stage{--panel-top:44px;--surface-top:156px;--surface-height:430px;--surface-width:min(540px,42vw)}
.stage .panels,.stage.contact-active .panels{top:var(--panel-top);transform:none}
.panel{justify-content:flex-start;overflow-y:auto;scrollbar-width:thin;padding-bottom:16px}
.contact-draft,.portal-preview{position:absolute;left:auto;right:7vw;top:var(--surface-top);bottom:auto;width:var(--surface-width);height:var(--surface-height);max-width:none;max-height:none;padding:20px;border:1px solid #ffffffa6;border-radius:14px;background:linear-gradient(135deg,#ffffff91,#e6f1fc62);backdrop-filter:blur(22px) saturate(125%);box-shadow:0 18px 55px #172b451c,inset 0 1px 0 #ffffffcc;transform:none;color:#172b45}
.portal-preview{display:none;flex-direction:column;z-index:3}
.preview-window{flex:1;min-height:0;height:auto;background:transparent;border:0;box-shadow:none;transform:none;border-radius:0}
.preview-screen{height:100%;padding:0;overflow:visible}
.preview-tabs{flex-shrink:0;margin:12px 0 0;padding-top:10px;border-top:1px solid #ffffff80;gap:4px;flex-wrap:nowrap}
.preview-tabs button{background:#ffffff45;border-color:#ffffff80}
.preview-tabs button[aria-selected=true]{background:#ffffffa6;color:#304f7f;box-shadow:0 2px 8px #172b4510}
.preview-stat,.preview-screen th{background:#ffffff55;border-color:#ffffff88}
.preview-screen td{border-color:#ffffff66}
.preview-journey,.preview-filter>span{background:#ffffff30;border-color:#ffffff80}
.contact-draft .form-status:empty{display:none}
.contact-draft textarea{height:72px;min-height:72px;resize:vertical}
.contact-draft .draft-header{margin-bottom:11px}
@media(min-width:1024px){.stage.portal-active .portal-preview{display:flex}}
/* The contact card is as tall as its form (the portal preview keeps the fixed height), capped to the room below it. */
@media(min-width:1024px){.contact-draft{height:auto;max-height:calc(100% - var(--surface-top) - 76px)}}
@media(max-width:1023px){.stage{--panel-top:48px}.stage .panels,.stage.wide-panel .panels,.stage.services-active .panels,.stage.portal-active .panels{width:86vw;left:7vw}.portal-preview{display:none}.stage.contact-active #contact .eyebrow,.stage.contact-active #contact p,.stage.contact-active #contact .contact-links{display:none}.stage.contact-active #contact h2{font-size:32px}.contact-draft{left:6vw;right:6vw;width:auto;height:auto;max-height:calc(100% - 230px);padding:18px 20px;overflow-y:auto}}
@media(max-width:600px){.stage{--panel-top:36px}.stage.contact-active #contact h2{font-size:25px}.stage .panels{bottom:140px}.contact-draft{padding:17px 18px}}

/* Retain the right-hand diagram on tablets; stack Services on narrower screens. */
@media(min-width:601px) and (max-width:1023px){.stage.services-active .logistics-scene{display:block;width:49vw;right:1vw;opacity:1}.stage.services-active .panels{width:43vw;left:6vw}}
@media(max-width:767px){.service-list{grid-template-columns:1fr;gap:6px}.service{padding:10px 0}.service p{font-size:13px;line-height:1.5}}
@media(max-width:600px){.stage.services-active .logistics-scene{display:none}.stage.services-active .panels{width:86vw;left:7vw}.service-list{grid-template-columns:1fr}}
.portal-preview .preview-tabs{border-top:0;padding-top:0}
.portal-preview .preview-screen{width:calc(100% / var(--preview-scale,1));height:calc(100% / var(--preview-scale,1));transform:scale(var(--preview-scale,1));transform-origin:top left}

@media(max-width:767px){.stage.services-active .logistics-scene{display:none}.stage.services-active .panels{width:86vw;left:7vw}}
@media(max-width:1023px){.stage.contact-active #contact h2{margin-bottom:20px}.stage.contact-active #contact .contact-links{display:grid;gap:12px;margin:0}.stage.contact-active #contact .contact-links a{font-size:18px;line-height:1.3;border:0;padding:0}.contact-draft{margin:0}}

.stage #contact .contact-links{max-width:430px;gap:12px}
.stage #contact .contact-links a.contact-card{display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;align-items:center;width:100%;padding:14px 16px;border:1px solid #ffffff9c;border-radius:12px;background:linear-gradient(135deg,#ffffff70,#e6f1fc35);box-shadow:inset 0 1px 0 #ffffff99,0 6px 22px #172b450a;backdrop-filter:blur(10px);color:#172b45;letter-spacing:normal;transition:background .2s,border-color .2s}
.stage #contact .contact-links a.contact-card:hover{background:#ffffffa0;border-color:#fff;color:#304f7f}
.contact-card svg{width:28px;height:28px;fill:none;stroke:#304f7f;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.contact-card-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.contact-card-label{font-size:12px;line-height:1.2;color:#496585}
.contact-card-value{font-size:17px;line-height:1.4}
.contact-card-address .contact-card-value{font-size:15px}
@media(max-width:1023px){.stage.contact-active #contact .contact-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:600px}.stage #contact .contact-links a.contact-card{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:12px}.contact-card-value{font-size:14px;white-space:nowrap}.stage #contact .contact-links a.contact-card-address{grid-column:1 / -1;display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px}.contact-card-address .contact-card-value{font-size:14px;white-space:normal}.contact-card svg{width:24px;height:24px}.contact-card-body{gap:5px}}
@media(max-width:380px){.contact-card-value{font-size:13px}}

@media(max-width:1023px){.stage #contact .contact-links a.contact-card{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:10px;padding:12px}.contact-card-value{white-space:normal;overflow-wrap:anywhere}}
@media(max-width:600px){.stage #contact .contact-links a.contact-card-address{display:none}}
@media(max-width:380px){.stage #contact .contact-links a.contact-card{grid-template-columns:18px minmax(0,1fr);gap:6px;padding:10px 8px}.contact-card svg{width:18px;height:18px}.contact-card-value{font-size:13px}}
.contact-card-address .contact-card-value{white-space:nowrap}
@media(max-width:1023px){.contact-draft{min-height:420px;overflow-y:auto}.stage.contact-address-hidden #contact .contact-links a.contact-card-address{display:none}}

/* Consistent breathing room from headings to copy and calls to action. */
.stage{--copy-space:32px;--paragraph-pad:4px}
.panel:not(#services):not(#history)>h1,.panel:not(#services):not(#history)>h2,.stage.contact-active #contact h2{margin-bottom:calc(var(--copy-space) - var(--paragraph-pad))}
.panel:not(#services):not(#history)>p{padding:var(--paragraph-pad) 0;margin:0 0 calc(var(--copy-space) - 2 * var(--paragraph-pad))}
.panel:not(#services):not(#history)>p:last-of-type{margin-bottom:calc(var(--copy-space) - var(--paragraph-pad))}
#history h2{margin-bottom:0}
#history h2 br{display:inline}
#history h2 em:before{content:none}
#history .history-line{margin:24px 0 28px;flex-shrink:0}
#history>p{padding:6px 0;margin:0 0 22px}
@media(max-width:600px){.landing-footer{padding:0 6vw;height:48px}.landing-footer .contacts{gap:16px;font-size:12px}.landing-footer .contacts>a span{display:none}.landing-footer .contacts i{font-size:17px}.stage{--copy-space:24px}#history .history-line{margin:20px 0 22px}#history>p{padding:5px 0;margin-bottom:18px}}
@media(max-width:600px){.stage .panels{bottom:68px}#history>p{max-width:none;padding:2px 0;margin-bottom:7px;line-height:1.45}#history .history-line{margin:12px 0 14px}}
@media(max-width:600px) and (max-height:700px){#history>p{font-size:12.5px;line-height:1.4;padding:1px 0;margin-bottom:5px}#history .history-line{margin:10px 0 12px}}

/* Shorter windows: tighter copy, so the panels keep fitting without a scrollbar of their own. */
@media(max-height:820px) and (min-width:601px){#history>p{font-size:15px;line-height:1.5;padding:3px 0;margin-bottom:12px}#history .history-line{margin:16px 0 18px}.stage #contact .contact-links a.contact-card{padding:10px 14px}.stage #contact .contact-links{gap:8px}}
@media(max-height:700px) and (min-width:601px){.panel:not(#home) h2{font-size:34px}h1{font-size:50px}#history>p{font-size:14px;line-height:1.45;margin-bottom:8px}.panels p{font-size:14px}.service{padding:8px 0}.service p{font-size:13px}.stage{--copy-space:22px}}
@media(max-height:640px) and (min-width:601px){.panel:not(#home) h2{font-size:30px}.stage{--copy-space:16px}.eyebrow{margin-bottom:10px}.service{padding:6px 0}.service b{margin-bottom:4px}.service p{font-size:12px;line-height:1.4}.service .num{margin-bottom:4px}.stage #contact .contact-links a.contact-card{padding:7px 12px}.contact-card svg{width:22px;height:22px}}
@media(max-height:640px) and (min-width:601px){.contact-draft{padding:14px 20px}.contact-draft textarea{height:48px;min-height:48px}.contact-draft .form-grid{gap:8px 12px}.contact-draft .form-tabs{margin-bottom:8px}.contact-draft .draft-header{margin-bottom:6px}.contact-draft .wide{margin-top:8px}.contact-draft .draft-submit{margin-top:8px}}

/* The Terms of Use panel (the footer link): laid out like About, plain text under the header. The text
   scrolls in its own region with a button per section underneath that scrolls to it, and the button of the
   section in view is marked. */
#legal{overflow:hidden}
.stage #legal{justify-content:flex-start}
.stage #legal>h2{margin-bottom:18px}
.legal-body{flex:1 1 auto;min-height:0;max-width:860px;overflow-y:auto;padding-right:14px;scrollbar-width:thin;scrollbar-color:#304f7f80 transparent;scroll-behavior:smooth;-webkit-mask-image:linear-gradient(transparent,#000 12px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(transparent,#000 12px,#000 calc(100% - 28px),transparent)}
.legal-body:focus-visible{outline:2px solid #304f7f;outline-offset:2px}
.legal-section{padding:0 0 26px;margin:0 0 26px}
.legal-section:last-child{margin-bottom:0}
.legal-section h3{font-size:22px;font-weight:500;letter-spacing:-.02em;margin:0 0 12px;color:#172b45}
.legal-section h5{font-size:14px;font-weight:700;margin:16px 0 6px;letter-spacing:0;color:#304f7f}
.legal-section p{font-size:14px;line-height:1.65;max-width:none;margin:0 0 12px;color:#233e5c}
.legal-section ol{margin:0 0 12px;padding:0;list-style:none;counter-reset:legal-item;font-size:14px;line-height:1.65;color:#233e5c}
.legal-section li{margin:0 0 8px;padding-left:26px;text-indent:-26px;counter-increment:legal-item}
.legal-section li::before{content:counter(legal-item) ".";display:inline-block;width:26px;text-indent:0}
.legal-section dl{display:grid;grid-template-columns:minmax(120px,32%) 1fr;gap:8px 18px;margin:0;font-size:14px;line-height:1.5;color:#233e5c}
.legal-section dt{font-weight:600}
.legal-section dd{margin:0}
.legal-tabs{flex:0 0 auto;display:flex;flex-wrap:wrap;gap:8px;max-width:860px;margin-top:14px}
.legal-tabs button{flex:1 1 auto;padding:10px 12px;border:1px solid #304f7f40;border-radius:4px;background:#ffffff70;color:#172b45;font-size:13px;transition:background .2s,color .2s,border-color .2s}
.legal-tabs button:hover{background:#ffffffa6}
.legal-tabs button[aria-current=true]{background:#304f7f;border-color:#839cbe;color:#fff}
@media(max-width:1023px){.legal-tabs button{padding:8px 10px;font-size:12px}}
@media(max-height:700px){.legal-tabs button{padding:7px 10px}.legal-tabs{margin-top:10px}.stage #legal>h2{margin-bottom:12px}}

/* Panels sit in the middle of the room between the header and the footer. "safe" keeps the top of a tall
   panel reachable instead of clipping it. */
.stage{--panel-top:40px;--panel-bottom:92px}
.stage .panel{padding-bottom:0}
.stage .panels{top:var(--panel-top);bottom:var(--panel-bottom)}
.stage .panel#home{justify-content:safe center}
.stage .panel:is(#history,#services,#portal,#contact){justify-content:flex-start}
@media(max-height:700px){.stage{--panel-top:32px;--panel-bottom:84px}}
@media(max-width:600px){.stage{--panel-top:36px;--panel-bottom:88px}}

/* Greek label glyphs use the same coherent sans-serif family as the body. */
html[lang=el] &{--label-font:Arial,Helvetica,sans-serif}
html[lang=el] & :is(.eyebrow,.chart-label,.network-label,.network-caption,.hint,.draft-badge,.landing-footer,.history-line,.mini){letter-spacing:.04em}
html[lang=el] & #home .mini{letter-spacing:.04em}
html[lang=el] & :is(.eyebrow,.network-label,.network-caption){font-weight:500}
html[lang=el] & .delivery-label{letter-spacing:.04em}
html[lang=el] & svg [font-family="monospace"]{font-family:var(--label-font);letter-spacing:.04em}
}

/* The site header above the stage is 72px tall, 60px on a narrow screen (site.css #header). */
@media(max-width:768px){.alma-landing{--header:60px}}

/* The landing header: the shared header's layout, without its border and shadow. Login is drawn like the
   page's primary button; the section links and the menu button have no border or background. */
#header.header-landing{box-shadow:none;border-bottom:0}
.header-landing .lh-login,.header-landing .lh-menu,.header-landing .lh-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;font:14px Arial,Helvetica,sans-serif;cursor:pointer;text-decoration:none;transition:background .2s,color .2s}
.header-landing .lh-login{padding:0 18px;border:1px solid #304f7f55;border-radius:5px;background:none;color:#172b45;margin:0}
.header-landing .lh-login:hover{background:#304f7f12;border-color:#304f7f;color:#304f7f}
.header-landing .lh-nav{display:none;align-items:center;gap:2px;margin-right:14px}
.header-landing .lh-link{padding:0 14px;border:0;background:none;color:#172b45;position:relative}
.header-landing .lh-link:hover{color:#304f7f}
.header-landing .lh-link::after{content:'';position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:1px;background:#304f7f;opacity:0;transition:opacity .2s}
.header-landing .lh-link.is-current{color:#304f7f}
.header-landing .lh-link.is-current::after{opacity:1}
.header-landing .lh-menu{width:40px;margin-left:10px;padding:0;font-size:28px;border:0;background:none;color:#172b45;line-height:1}
.header-landing .lh-menu:hover{background:none;color:#304f7f}
@media(min-width:992px){.header-landing .lh-nav{display:flex}.header-landing .lh-menu{display:none}}
@media(max-width:768px){.header-landing .lh-login{padding:0 14px;height:36px;font-size:13px}.header-landing .lh-menu{height:36px;width:36px;margin-left:4px;font-size:26px}}
