.pageSection{background:radial-gradient(circle at 0 0,#0d6efd14,#0000 32%),radial-gradient(circle at 100% 0,#19875414,#0000 24%)}.heroPanel{background:linear-gradient(#ffffffeb,#ffffffc7);border:1px solid #0d6efd14;border-radius:28px;padding:2rem 1.5rem;box-shadow:0 18px 45px #0f172a0f}.heroEyebrow{color:#0d6efd;letter-spacing:.04em;text-transform:uppercase;background:#0d6efd14;border-radius:999px;align-items:center;gap:.5rem;margin-bottom:1rem;padding:.45rem .9rem;font-size:.85rem;font-weight:700;display:inline-flex}.heroLead{max-width:760px}.summaryCard{border-radius:22px;transition:transform .2s,box-shadow .2s}.summaryCard:hover{transform:translateY(-4px);box-shadow:0 1rem 2.5rem #0f172a1f}.summaryIcon{flex-shrink:0}.routeCard{border-radius:24px;overflow:hidden}.routeHeader{color:#fff;background:linear-gradient(135deg,#0d6efd,#2496ff);border-bottom:0}.routeSubhead{color:#ffffffd1;font-size:.95rem}.routeBadge{color:#fff;white-space:nowrap;background:#ffffff2e;border-radius:999px;justify-content:center;align-items:center;padding:.5rem .85rem;font-size:.82rem;font-weight:700;display:inline-flex}.destinationList{gap:.9rem;display:grid}.destinationItem{background:linear-gradient(#fff,#f8fbff);border:1px solid #0f172a14;border-radius:18px;padding:1rem}.metaGroup{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.metaPill{color:#4b5563;white-space:nowrap;background:#f1f6ff;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .7rem;font-size:.82rem;font-weight:500;line-height:1.35;display:inline-flex}.routeActionBtn{white-space:nowrap;flex-shrink:0}.portsCard{background:#fff;border-radius:28px;box-shadow:0 10px 30px #0000000a}.portFilterWrap{-webkit-overflow-scrolling:touch;scrollbar-width:none;align-items:center;gap:.5rem;padding-bottom:.35rem;display:flex;overflow-x:auto}.portFilterWrap::-webkit-scrollbar{display:none}.portFilterBtn{color:#475569;white-space:nowrap;cursor:pointer;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;align-items:center;gap:.45rem;padding:.45rem .95rem;font-size:.85rem;font-weight:500;transition:all .2s;display:inline-flex}.portFilterBtn:hover{color:#0d6efd;background:#f1f5f9;border-color:#cbd5e1}.portFilterBtn.active{color:#fff;background:#0d6efd;border-color:#0d6efd;box-shadow:0 4px 12px #0d6efd40}.portFilterBadge{background:#00000012;border-radius:999px;justify-content:center;align-items:center;padding:.1rem .45rem;font-size:.72rem;font-weight:600;display:inline-flex}.portFilterBtn.active .portFilterBadge{color:#fff;background:#ffffff40}.portSearchInputWrap{width:100%;position:relative}.portSearchInput{background:#f8fafc!important;border:1px solid #e2e8f0!important;border-radius:999px!important;height:40px!important;padding-left:2.35rem!important;padding-right:2rem!important;font-size:.86rem!important;transition:all .2s!important}.portSearchInput:focus{background:#fff!important;border-color:#0d6efd!important;box-shadow:0 0 0 3px #0d6efd1f!important}.portSearchIcon{color:#94a3b8;pointer-events:none;position:absolute;top:50%;left:.9rem;transform:translateY(-50%)}.portSearchClear{color:#94a3b8;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:20px;height:20px;padding:0;display:flex;position:absolute;top:50%;right:.8rem;transform:translateY(-50%)}.portSearchClear:hover{color:#475569}.portGridCard{background:#fff;border:1px solid #e2e8f0;border-radius:16px;align-items:center;gap:.8rem;height:100%;padding:.85rem .95rem;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex}.portGridCard:hover{background:#fbfdff;border-color:#93c5fd;transform:translateY(-2px);box-shadow:0 8px 18px #0d6efd14}.portIconBox{color:#0d6efd;background:#eff6ff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;transition:all .2s;display:flex}.portGridCard:hover .portIconBox{color:#fff;background:#0d6efd}.portCardName{color:#1e293b;margin-bottom:.15rem;font-size:.9rem;font-weight:600;line-height:1.25}.portCardIsland{color:#64748b;align-items:center;gap:.25rem;font-size:.76rem;font-weight:500;display:inline-flex}.portRegionBadge{color:#64748b;white-space:nowrap;background:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;flex-shrink:0;margin-left:auto;padding:.2rem .5rem;font-size:.72rem;font-weight:500}.portChipWrap{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.portChip{color:#334155;background:#f1f6ff;border:1px solid #0d6efd24;border-radius:999px;align-items:center;gap:.5rem;padding:.55rem .9rem;font-size:.9rem;font-weight:500;display:inline-flex}.portPanel{background:#fff;border-radius:22px;height:100%;padding:1.4rem 1.35rem;box-shadow:inset 0 0 0 1px #0f172a0d}.portAccentPrimary{border-left:5px solid #0d6efd}.portAccentSuccess{border-left:5px solid #198754}.portList{gap:.85rem;display:grid}.portList li{color:#4b5563;padding-left:1.1rem;position:relative}.portList li:before{content:"";opacity:.55;background:currentColor;border-radius:50%;width:.45rem;height:.45rem;position:absolute;top:.62rem;left:0}@media (max-width:991.98px){.heroPanel{padding:1.75rem 1.25rem}.routeBadge{align-self:flex-start}}@media (max-width:575.98px){.heroPanel{border-radius:22px}.routeCard,.portsCard,.summaryCard,.portPanel,.destinationItem{border-radius:18px}.metaPill{padding:.25rem .55rem;font-size:.76rem}.portGridCard{border-radius:14px;gap:.65rem;padding:.75rem .85rem}.portIconBox{border-radius:9px;width:34px;height:34px}.portCardName{font-size:.86rem}.portCardIsland{font-size:.74rem}.portRegionBadge{padding:.15rem .4rem;font-size:.68rem}}
