/* Layout "wizard" (/2/): product column on the left; on the right a step bar and one section at a time
   (package → shipping → payment), with the order summary under the active step. Steps are switched by assets/layout.js. */
.fn-off{display:none!important}
.fn-l-wizard .fn-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"show bar" "show packs" "show details" "show pay" "show side";align-items:start}
.fn-wiz-bar{grid-area:bar;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:#fff;border-radius:999px;padding:6px;box-shadow:0 6px 24px rgba(29,53,87,.08)}
.fn-wiz-bar button{display:flex;align-items:center;justify-content:center;gap:8px;border:0;background:transparent;border-radius:999px;padding:10px 8px;font:600 .9rem Manrope,Inter,sans-serif;color:#7b8798;cursor:pointer}
.fn-wiz-bar b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#eef1f6;font-size:.78rem}
.fn-wiz-bar button.on{background:#1d3557;color:#fff}
.fn-wiz-bar button.on b{background:#e63946;color:#fff}
.fn-wiz-bar button.done{color:#1d3557}
.fn-wiz-bar button.done b{background:#d7f0df;color:#15803d}
.fn-wiz-nav{display:flex;justify-content:space-between;gap:12px;margin-top:18px}
.fn-pay-card .fn-wiz-nav{margin:-6px 0 14px}
.fn-wiz-next{margin-left:auto;border:0;border-radius:999px;background:#1d3557;color:#fff;font:700 1rem Manrope,Inter,sans-serif;padding:15px 26px;cursor:pointer}
.fn-wiz-next:hover{background:#14243d}
.fn-wiz-back{border:0;background:none;color:#5d6670;font:600 .92rem Manrope,Inter,sans-serif;cursor:pointer;padding:8px 0}
.fn-l-wizard .fn-side{position:static}
@media (max-width:900px){
  .fn-l-wizard .fn-grid{grid-template-columns:1fr;grid-template-areas:"show" "bar" "packs" "details" "pay" "side"}
  .fn-wiz-bar span{font-size:.8rem}
  .fn-wiz-next{width:100%}
  .fn-wiz-nav{flex-wrap:wrap}
}

/* ---- thank-you page: centered navy banner with a big check, two columns — details and addresses on the left,
   the order overview and help on the right; order details as 2×2 tiles */
.fn-l-wizard .fn-ty2>.fn-alert{grid-area:alert}.fn-l-wizard .fn-ty-warn{grid-area:warn}.fn-l-wizard .fn-ty-ship{grid-area:ship}.fn-l-wizard .fn-ty2>section:nth-of-type(1){grid-area:det}.fn-l-wizard .fn-ty-addrs{grid-area:addr}.fn-l-wizard .fn-ty-form{grid-area:form}.fn-l-wizard .fn-ty2>section:nth-of-type(2){grid-area:over}.fn-l-wizard .fn-ty-print{grid-area:print}.fn-l-wizard .fn-ty-help{grid-area:help}
.fn-l-wizard .fn-ty-banner{background:#1d3557;text-align:center;padding:44px 0 86px}
.fn-l-wizard .fn-ty-banner-in{flex-direction:column;align-items:center;margin:0 auto}
.fn-l-wizard .fn-ty-check{width:76px;height:76px;flex-basis:76px;background:#e63946;color:#fff;box-shadow:0 0 0 10px rgba(230,57,70,.25)}
.fn-l-wizard .fn-ty-banner h1{font-size:clamp(1.6rem,3vw,2.3rem);color:#fff}
.fn-l-wizard .fn-ty2{display:grid;max-width:1100px;grid-template-columns:minmax(0,1fr) 380px;grid-template-areas:"alert alert" "warn warn" "det over" "addr over" "ship help" "form form" ". print";gap:16px 22px;align-items:start}
.fn-l-wizard .fn-ty2>section:nth-of-type(1) .fn-ty-table{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fn-l-wizard .fn-ty2>section:nth-of-type(1) .fn-ty-table div{flex-direction:column;align-items:flex-start;gap:4px;border:0;background:#f5f8fd;border-radius:14px;padding:14px 16px}
.fn-l-wizard .fn-ty2>section:nth-of-type(1) .fn-ty-table dt{font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:#5d6670}
.fn-l-wizard .fn-ty2>section:nth-of-type(1) .fn-ty-table dd{text-align:left;font-weight:800;color:#14243d;font-size:1.05rem}
.fn-l-wizard .fn-ty2>section:nth-of-type(2){position:sticky;top:16px;border-top:4px solid #e63946}
.fn-l-wizard .fn-ty-help{flex-direction:column;background:#fff;border-color:#dfe4ec}
@media (max-width:860px){.fn-l-wizard .fn-ty2{grid-template-columns:minmax(0,1fr);grid-template-areas:"alert" "warn" "det" "over" "addr" "form" "ship" "help" "print"}.fn-l-wizard .fn-ty2>section:nth-of-type(2){position:static}}
