/* Open-menu panel — four variants (html.pv1..pv4). Spacing scale 4/8/12/16/24/32. */
.panel{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;padding:0;overflow:auto;
  background:var(--green);color:#fff;visibility:hidden;opacity:0;transition:opacity .25s ease,transform .3s ease,visibility 0s linear .3s}
html.menu-open .panel{visibility:visible;opacity:1;transition:opacity .25s ease,transform .3s ease}
.p-scrim{position:fixed;inset:0;z-index:55;background:rgba(21,21,18,.5);opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s linear .25s}
.panel nav,.panel .top,.panel .langs,.panel .foot{display:none}

.p-top{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;min-height:var(--navh,58px)}
.p-top img{height:36px;width:auto}
.p-logo-c{display:none}
.panel .close{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:inherit;padding:0}
.panel .close span{position:relative;display:block;width:20px;height:20px}
.panel .close span::before,.panel .close span::after{content:"";position:absolute;left:-1px;top:9px;width:22px;height:2px;background:currentColor}
.panel .close span::before{transform:rotate(45deg)}.panel .close span::after{transform:rotate(-45deg)}

.p-body{padding:24px 16px 16px;display:flex;flex-direction:column;gap:24px}
.p-kicker{margin:0;font-size:12px;line-height:18px;font-weight:bold;letter-spacing:1.6px;text-transform:uppercase;color:var(--f-accent)}
.p-links{list-style:none;margin:0;padding:0}
.p-links li{border-top:1px solid rgba(255,255,255,.18)}
.p-links li:last-child{border-bottom:1px solid rgba(255,255,255,.18)}
.panel .p-links a{display:flex;align-items:center;justify-content:flex-start;gap:16px;padding:20px 0;color:inherit;text-decoration:none;font-size:inherit;line-height:inherit;font-weight:inherit}
.panel .p-links a:hover{color:inherit}
.p-links .n{font-size:12px;letter-spacing:1.4px;color:var(--f-accent);min-width:20px}
.p-links .t{flex:1;font-size:26px;line-height:32px;font-weight:bold}
.p-links .arr{width:16px;height:16px;opacity:.7;transition:transform .2s}
.p-links a:hover .arr{transform:translateX(4px);opacity:1}
.p-cta{display:flex;align-items:center;justify-content:center;height:52px;background:var(--cta);color:var(--cta-text);text-decoration:none;font-weight:bold;font-size:14px;letter-spacing:1.4px;text-transform:uppercase}
.p-cta:hover{background:#b9a46b}
.p-langs{display:flex;flex-direction:column;gap:8px}
.p-label{font-size:12px;line-height:18px;letter-spacing:1.4px;text-transform:uppercase;opacity:.8}
.p-seg{display:flex;border:1px solid rgba(255,255,255,.45)}
.p-seg a{flex:1;text-align:center;padding:11px 4px;color:inherit;text-decoration:none;font-size:14px;line-height:18px}
.p-seg a+a{border-left:1px solid rgba(255,255,255,.45)}
.p-seg a[aria-current="true"]{background:#fff;color:var(--green);font-weight:bold}
.p-foot{margin-top:auto;padding:24px 16px 28px;display:flex;flex-direction:column;gap:2px;font-size:13px;line-height:20px;color:var(--f-legal)}
.p-foot span[lang]{color:var(--f-accent)}
.p-horizon{display:none}

/* burger turns into an X while the menu is open (visible in V4, where the bar stays) */
.nv4 .burger i{transition:background .2s}
.nv4 .burger i::before,.nv4 .burger i::after{transition:transform .25s,top .25s}
html.menu-open .nv4 .burger i{background:transparent}
html.menu-open .nv4 .burger i::before{top:0;transform:rotate(45deg)}
html.menu-open .nv4 .burger i::after{top:0;transform:rotate(-45deg)}

/* ---------- V1 · full-screen green ---------- */
html.pv1 .panel{transform:translateY(-8px)}
html.pv1.menu-open .panel{transform:none}

/* ---------- V2 · white drawer from the right over a dimmed page ---------- */
html.pv2 .panel{left:auto;width:min(86vw,380px);background:#fff;color:var(--green);transform:translateX(100%);opacity:1;box-shadow:-12px 0 40px rgba(21,21,18,.18)}
html.pv2.menu-open .panel{transform:none}
html.pv2.menu-open .p-scrim{opacity:1;visibility:visible;transition:opacity .25s}
html.pv2 .p-logo-w{display:none} html.pv2 .p-logo-c{display:block}
html.pv2 .p-top{border-bottom:1px solid var(--divider)}
html.pv2 .p-kicker{color:var(--label)}
html.pv2 .p-links li{border-color:var(--divider)}
html.pv2 .p-links .n{color:var(--label)}
html.pv2 .p-links .t{font-size:20px;line-height:26px}
html.pv2 .panel .p-links a{padding:18px 0}
html.pv2 .p-seg{border-color:var(--green)}
html.pv2 .p-seg a+a{border-left-color:var(--green)}
html.pv2 .p-seg a[aria-current="true"]{background:var(--green);color:#fff}
html.pv2 .p-foot{color:var(--muted)} html.pv2 .p-foot span[lang]{color:var(--green)}

/* ---------- V3 · light full screen with the landscape ---------- */
html.pv3 .panel{background:#ECECE3;color:var(--green)}
html.pv3 .p-logo-w{display:none} html.pv3 .p-logo-c{display:block}
html.pv3 .p-body{align-items:center;text-align:center;padding-top:32px}
html.pv3 .p-kicker{color:var(--label)}
html.pv3 .p-links{width:100%}
html.pv3 .p-links li,html.pv3 .p-links li:last-child{border:0}
html.pv3 .panel .p-links a{justify-content:center;flex-direction:column;gap:4px;padding:12px 0}
html.pv3 .p-links .n{color:var(--label)}
html.pv3 .p-links .arr{display:none}
html.pv3 .p-links .t{font-size:30px;line-height:36px}
html.pv3 .p-cta{width:100%}
html.pv3 .p-langs{width:100%;align-items:center}
html.pv3 .p-seg{width:100%;border-color:var(--green)}
html.pv3 .p-seg a+a{border-left-color:var(--green)}
html.pv3 .p-seg a[aria-current="true"]{background:var(--green);color:#fff}
html.pv3 .p-foot{display:none}
html.pv3 .p-horizon{display:block;margin-top:auto;flex:none;height:min(32vh,42vw);min-height:130px;background:url(/assets/horizon.png) center bottom/cover no-repeat}

/* ---------- V4 · drops down under the bar, page dimmed ---------- */
html.pv4 .panel{top:var(--navh,58px);bottom:auto;max-height:calc(100vh - var(--navh,58px));background:#fff;color:var(--green);transform:translateY(-12px);box-shadow:0 16px 32px rgba(21,21,18,.18)}
html.pv4.menu-open .panel{transform:none}
html.pv4.menu-open .p-scrim{opacity:1;visibility:visible;top:var(--navh,58px);transition:opacity .25s}
html.pv4 .p-top,html.pv4 .p-foot,html.pv4 .p-kicker{display:none}
html.pv4 .p-body{padding:8px 16px 24px;gap:16px}
html.pv4 .p-links li{border-color:var(--divider)}
html.pv4 .p-links li:first-child{border-top:0}
html.pv4 .p-links .n{color:var(--label)}
html.pv4 .p-links .t{font-size:18px;line-height:24px}
html.pv4 .panel .p-links a{padding:16px 0}
html.pv4 .p-langs{flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
html.pv4 .p-seg{flex:1;max-width:260px;border-color:var(--green)}
html.pv4 .p-seg a{padding:9px 4px}
html.pv4 .p-seg a+a{border-left-color:var(--green)}
html.pv4 .p-seg a[aria-current="true"]{background:var(--green);color:#fff}
html.pv4 .p-label{opacity:1;color:var(--muted)}
html.pv4.menu-open .nv4{z-index:65}

@media (min-width:761px){
  .p-body{max-width:640px;margin:0 auto;width:100%;padding-top:48px}
  .p-top{padding:14px 24px}
}

/* open menu: logo +50% (36px → 54px) */
.p-top{padding-top:12px;padding-bottom:12px}
.p-top img{height:54px}
