
:root{--portal-navy:#17345f;--portal-gold:#d5ad42;--portal-ink:#18263a;--portal-muted:#64748b;}
*{box-sizing:border-box}
body{margin:0}
.zone-page{max-width:1180px;margin:0 auto;padding:42px 24px 64px;font-family:Inter,Arial,sans-serif;color:var(--portal-ink)}
.zone-heading{text-align:center;margin:18px auto 34px;max-width:760px}
.zone-heading .eyebrow{font-size:.72rem;font-weight:800;letter-spacing:.18em;color:#9a7621;margin-bottom:12px}
.zone-heading h1{font-family:Georgia,serif;font-size:clamp(2rem,4vw,3rem);margin:0 0 12px;color:var(--portal-navy)}
.zone-heading p{font-size:1rem;line-height:1.7;color:var(--portal-muted);margin:0}
.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:24px;align-items:stretch}
.zone-card{--accent:#315d92;min-height:230px;position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:26px 24px 22px;border-radius:22px;text-decoration:none;color:#fff;background:linear-gradient(145deg,var(--accent),#101e36);border:1px solid rgba(255,255,255,.35);box-shadow:0 10px 0 rgba(12,26,48,.16),0 18px 30px rgba(12,26,48,.18),inset 0 1px 0 rgba(255,255,255,.35);transform:translateY(0);transition:transform .22s,box-shadow .22s;overflow:hidden}
.zone-card:nth-child(4n+2){--accent:#9a632c;background:linear-gradient(145deg,#b87a37,#4d2b16)}
.zone-card:nth-child(4n+3){--accent:#21806b;background:linear-gradient(145deg,#26967b,#12483e)}
.zone-card:nth-child(4n+4){--accent:#7256a5;background:linear-gradient(145deg,#8a6bc1,#35264f)}
.zone-card:before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;right:-65px;top:-75px;background:rgba(255,255,255,.09);box-shadow:0 0 0 18px rgba(255,255,255,.035),0 0 0 38px rgba(255,255,255,.025)}
.zone-card:hover{transform:translateY(-8px) rotateX(2deg);box-shadow:0 15px 0 rgba(12,26,48,.13),0 28px 42px rgba(12,26,48,.24),inset 0 1px 0 rgba(255,255,255,.4)}
.zone-icon{font-size:2.7rem;line-height:1;margin-bottom:24px;filter:drop-shadow(0 4px 5px rgba(0,0,0,.2));z-index:1}
.zone-title{font-family:Georgia,serif;font-size:1.45rem;font-weight:700;line-height:1.2;margin-bottom:10px;z-index:1}
.zone-desc{font-size:.88rem;line-height:1.6;color:rgba(255,255,255,.82);max-width:290px;z-index:1}
.zone-action{margin-top:auto;padding-top:22px;font-size:.82rem;font-weight:800;letter-spacing:.04em;color:#ffe6a1;z-index:1}
.zone-action b{font-size:1.15rem;margin-left:8px}
.portal-backbar{position:sticky;top:0;z-index:9998;display:flex;align-items:center;gap:10px;padding:9px 16px;background:rgba(15,35,71,.97);border-bottom:2px solid #c9a227;color:#fff;font:600 13px Inter,Arial,sans-serif;box-shadow:0 3px 12px rgba(0,0,0,.12)}
.portal-backbar a,.portal-backbar button{border:1px solid rgba(255,255,255,.25);border-radius:18px;padding:7px 13px;color:#fff;background:rgba(255,255,255,.08);font:inherit;text-decoration:none;cursor:pointer}
.portal-backbar a:hover,.portal-backbar button:hover{background:#c9a227;color:#14294a}
.portal-backbar .portal-brand{font-weight:800;letter-spacing:.04em;margin-right:auto}
.portal-ad{width:100%;padding:7px 14px;background:#f3f1ed;text-align:center}
.portal-ad-inner{max-width:970px;margin:0 auto}
@media(max-width:620px){.zone-page{padding:28px 16px 48px}.zone-grid{grid-template-columns:1fr}.zone-card{min-height:190px}.portal-backbar{padding:8px;gap:6px}.portal-backbar a,.portal-backbar button{padding:7px 9px;font-size:12px}.portal-backbar .portal-brand{font-size:11px}}
