/* Open-route ferry ticket sale page (views/front/openroute.view.php). Scoped under .orx. */
.orx{--ink:#0f172a;--body:#334155;--muted:#64748b;--line:#e6e9f0;--soft:#f6f7fa;--blue:#2b3991;--blue-soft:#eef1fb;--orange:#f7931d;--r:16px;--shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);--navy:#1c2a6b;display:block;float:left;clear:both;width:100%;flex:0 0 100%;max-width:100%;min-width:0;background:#f4f5f8;color:var(--ink);font-size:15px;line-height:1.5;padding:0 0 90px}
.orx *{box-sizing:border-box}
.orx button{font:inherit;cursor:pointer}
.orx-wrap{max-width:1120px;margin:0 auto;padding:0 16px}
/* heading band (the site header floats, so .orx floats and clears it, see above) */
.orx-head{position:relative;overflow:hidden;background:var(--navy);padding:40px 0 76px}
.orx-head .orx-wrap{position:relative;z-index:1}
/* decorative icons: white line art, a few orange accents; the title side stays clear */
.orx-deco{position:absolute;inset:0;pointer-events:none;color:#fff}
.orx-deco svg{position:absolute;display:block;opacity:.2}
.orx-deco .i1{width:46px;height:46px;left:52%;top:26px;transform:rotate(-6deg);opacity:.28}
.orx-deco .i2{width:38px;height:38px;right:7%;top:18px;color:var(--orange);opacity:.75}
.orx-deco .i3{width:44px;height:44px;left:41%;top:62px;opacity:.16}
.orx-deco .i4{width:40px;height:40px;right:20%;top:40px;transform:rotate(4deg);opacity:.26}
.orx-deco .i5{width:30px;height:30px;left:63%;top:66px;transform:rotate(14deg);color:var(--orange);opacity:.7}
.orx-deco .i6{width:28px;height:28px;right:31%;top:14px;opacity:.22}
.orx-deco .i7{width:34px;height:34px;right:3%;top:64px;transform:rotate(-12deg);opacity:.24}
.orx-deco .i8{width:16px;height:16px;left:47%;top:16px;color:var(--orange);opacity:.8}
.orx-deco .i9{width:26px;height:26px;right:12%;top:72px;transform:rotate(10deg);opacity:.18}
.orx-deco .i10{width:24px;height:24px;left:75%;top:64px;opacity:.22}
.orx-deco .i11{width:46px;height:46px;left:1.5%;top:62px;opacity:.16}
.orx-deco .i12{width:12px;height:12px;right:27%;top:86px;opacity:.5}
.orx-deco .i13{width:40px;height:40px;left:1.5%;top:12px;transform:rotate(-8deg);opacity:.24}
.orx-deco .i14{width:20px;height:20px;left:11%;top:8px;color:var(--orange);opacity:.8}
.orx-deco .i15{width:28px;height:28px;left:20%;top:80px;opacity:.24}
.orx-deco .i16{width:32px;height:32px;left:32%;top:4px;transform:rotate(-10deg);color:var(--orange);opacity:.7}
.orx-deco .i17{width:30px;height:30px;left:29%;top:78px;opacity:.22}
.orx-deco .i18{width:16px;height:16px;left:8%;top:88px;opacity:.5}
.orx-head h1{margin:0;color:#fff;font-size:32px;line-height:1.15;letter-spacing:-.6px;font-weight:700}
.orx-head .orx-sub{margin:6px 0 0;color:#c9d3f2;font-size:17px;line-height:1.35;font-weight:500}
.orx-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start;margin:-44px auto 0;position:relative;z-index:2}
.orx-main,.orx-sum{background:#fff;border-radius:var(--r);box-shadow:var(--shadow)}
.orx-sec{padding:24px 28px;border-top:1px solid var(--line)}.orx-main>.orx-sec:first-child{border-top:0}
.orx-lbl{font-size:12px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
/* how it works: three short points above the groups */
.orx-how{list-style:none;margin:0 0 24px;padding:4px 20px;display:block;background:var(--blue-soft);border-radius:14px}
.orx-how li{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:14px;align-items:center;margin:0;padding:12px 0}
.orx-how li+li{border-top:1px solid #d9def0}
.orx-how i{grid-row:1 / span 2;width:36px;height:36px;border-radius:999px;background:#fff;color:var(--blue);display:grid;place-items:center;font-size:15px}
.orx-how b{font-size:15px;font-weight:700;color:var(--ink);line-height:1.3}
.orx-how span{font-size:14px;line-height:1.45;color:var(--body)}
/* route groups: tier cards */
.orx-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch}
.orx-group{display:flex;flex-direction:column;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:14px;padding:18px 18px 16px;color:var(--ink);transition:border-color .15s,box-shadow .15s,transform .15s}
.orx-group:hover{border-color:#c9cfdf;box-shadow:0 6px 18px rgba(15,23,42,.07)}
.orx-group[aria-checked=true]{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue) inset,0 10px 24px rgba(43,57,145,.12)}
.orx-group-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.orx-group-name{font-size:13px;font-weight:700;letter-spacing:.3px;color:var(--muted);text-transform:uppercase}
.orx-group[aria-checked=true] .orx-group-name{color:var(--blue)}
.orx-check{flex:0 0 22px;width:22px;height:22px;border-radius:999px;border:2px solid #cfd5e3;background:#fff;position:relative}
.orx-group[aria-checked=true] .orx-check{border-color:var(--blue);background:var(--blue)}
.orx-group[aria-checked=true] .orx-check:after{content:"";position:absolute;left:6px;top:2px;width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.orx-group-price{display:block;margin-top:10px}
.orx-group-price b{display:block;font-size:32px;line-height:1.05;letter-spacing:-.8px;font-weight:700}
.orx-group[aria-checked=true] .orx-group-price b{color:var(--blue)}
.orx-group-price small{display:block;margin-top:2px;font-size:12px;color:var(--muted)}
.orx-routes-n{display:block;margin:14px 0 8px;padding-top:12px;border-top:1px solid var(--line);font-size:12px;font-weight:600;color:var(--muted)}
.orx-routes{display:flex;flex-direction:column;gap:6px}
.orx-route{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;font-size:13.5px;line-height:1.35}
.orx-route .d{color:var(--body)}
.orx-route .a{font-weight:600;color:var(--ink)}
.orx-route i{font-style:normal;color:#9aa3b8}
.orx-route .or{font-style:normal;font-size:12px;font-weight:500;color:var(--muted);margin-left:4px}
/* passengers */
.orx-pax{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.orx-pax-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:20px;padding:12px 16px}
.orx-pax-row+.orx-pax-row{border-top:1px solid #f0f1f5}
.orx-pax-n{font-size:15px;font-weight:600}.orx-pax-n small{display:block;font-size:12px;font-weight:400;color:var(--muted)}
.orx-pax-p{text-align:right;white-space:nowrap}
.orx-pax-p b{display:block;font-size:15px;font-weight:700;color:var(--ink)}
.orx-pax-p small{display:block;font-size:11.5px;color:var(--muted)}
.orx-stp{display:flex;align-items:center;gap:12px}
.orx-stp button{width:34px;height:34px;border-radius:999px;border:1px solid #cfd5e3;background:#fff;font-size:18px;line-height:1;display:grid;place-items:center;color:var(--blue);padding:0}
.orx-stp button:disabled{opacity:.3;cursor:default;color:var(--ink)}
.orx-stp output{min-width:18px;text-align:center;font-size:16px;font-weight:700}
/* summary */
.orx-sum{position:sticky;top:16px;overflow:hidden}
.orx-sum dl{margin:0;padding:20px 22px 4px}
.orx-sum dl>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.orx-sum dl>div:first-child{border-top:0}
.orx-sum dt{color:var(--muted);font-weight:500}.orx-sum dd{margin:0;text-align:right;font-weight:600}
.orx-tot{display:flex;justify-content:space-between;align-items:baseline;margin:6px 22px 0;padding:14px 0 0;border-top:1px solid var(--line)}
.orx-tot span{font-size:14px;font-weight:600;color:var(--muted)}.orx-tot b{font-size:28px;letter-spacing:-.6px;color:var(--ink)}
.orx-btn{display:block;width:calc(100% - 44px);margin:16px 22px 22px;border:0;border-radius:999px;background:var(--orange);color:#fff;font-weight:700;font-size:15px;padding:14px 18px}
.orx-mbar{display:none}
@media (max-width:1060px){.orx-groups{grid-template-columns:1fr}.orx-routes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px}}
@media (max-width:900px){
  .orx-grid{grid-template-columns:1fr}
  .orx-sum{position:static}
  .orx-head{padding:28px 0 64px}.orx-head h1{font-size:26px}
  .orx-deco svg{display:none}
  .orx-deco .i2,.orx-deco .i6,.orx-deco .i8{display:block}
  .orx-deco .i2{width:22px;height:22px;right:5%;top:6px}.orx-deco .i6{width:16px;height:16px;right:16%;top:8px}.orx-deco .i8{width:10px;height:10px;right:25%;top:6px}
  .orx-sec{padding:20px 16px}
  .orx-routes{grid-template-columns:1fr}
  .orx-how{padding:4px 16px}
  .orx-pax-row{gap:12px}
  .orx-sum .orx-btn{display:none}
  .orx-mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;align-items:center;justify-content:space-between;gap:12px;background:#fff;padding:12px 16px;box-shadow:0 -6px 20px rgba(15,23,42,.1)}
  .orx-mbar small{display:block;font-size:12px;color:var(--muted)}.orx-mbar b{font-size:20px}
  .orx-mbar .orx-btn{width:auto;margin:0;padding:12px 22px}
}
@media (max-width:480px){
  .orx-pax-row{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px}
  .orx-pax-p{grid-column:1;grid-row:2;text-align:left}
  .orx-pax-p b,.orx-pax-p small{display:inline}
  .orx-pax-p small{margin-left:6px}
  .orx-stp{grid-column:2;grid-row:1/3}
}