/* Premium Travel Egypt 2.0 — the logo's sun (yellow → orange) over the sea (two blues).
   Loaded after theme.css: re-skins the shared layout with the brand. */
:root {
	--zs-navy: #0A2D5E;
	--zs-navy-2: #0E3B78;
	--zs-gold: #D9541A;
	--zs-gold-2: #F7931E;
	--zs-sapphire: #0B6BD3;
	--zs-sand: #FFF6EC;
	--zs-ink: #14233F;
	--zs-muted: #556175;
	--zs-line: #EADFD1;
	--pt-sun: linear-gradient(135deg, #FFC52E 0%, #F7931E 48%, #EE5A24 100%);
	--pt-sea: linear-gradient(160deg, #1C8BEA 0%, #0B6BD3 45%, #0A2D5E 100%);
	--zs-display: Fraunces, Georgia, "Times New Roman", serif;
	--zs-body: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
body { background: #fff; }
.zs-head h2 { font-weight: 600; letter-spacing: -0.01em; }
.zs-eyebrow { letter-spacing: 0.14em; }

/* Buttons: sun gradient with deep-sea text; navy buttons get a sun underline. */
.zs-btn-gold { background: var(--pt-sun); color: #0A2D5E; box-shadow: 0 8px 20px rgba(238, 90, 36, 0.25); }
.zs-btn-navy { box-shadow: inset 0 -3px 0 #F7931E; }
@media (hover: hover) {
	.zs-btn-gold:hover { background: linear-gradient(135deg, #FFD34F 0%, #F9A23A 48%, #F06A35 100%); }
}

/* Header — white bar, the colour logo, navy links, sun hover. */
.zs-header { background: #fff; border-bottom: 1px solid var(--zs-line); box-shadow: 0 6px 24px rgba(10, 45, 94, 0.06); }
.zs-header-row { min-height: 80px; }
.zs-header .zs-brand-mark { height: 50px !important; }
.zs-header .zs-nav { color: var(--zs-navy); }
.zs-header .zs-nav .wp-block-navigation-item__content,
.zs-header .zs-nav .wp-block-navigation-submenu__toggle { color: var(--zs-navy) !important; font-weight: 600; }
@media (hover: hover) { .zs-header .zs-nav .wp-block-navigation-item__content:hover { color: var(--zs-gold) !important; } }
.zs-header .zs-nav .wp-block-navigation__responsive-container-open,
.zs-header .zs-nav .wp-block-navigation__responsive-container-close { color: var(--zs-navy); }
.zs-header .zs-nav .wp-block-navigation__submenu-container { background: #fff !important; border: 1px solid var(--zs-line) !important; box-shadow: 0 22px 44px rgba(10, 45, 94, 0.14) !important; }
@media (hover: hover) { .zs-header .zs-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--zs-sand); } }
.zs-icon-btn { color: var(--zs-sapphire); border-color: rgba(11, 107, 211, 0.3); background: #fff; }
@media (max-width: 600px) {
	.zs-header-row { min-height: 66px; }
	.zs-header .zs-brand-mark { height: 40px !important; }
}

/* 1. Hero "sun window" — cream ground, a soft sun behind, photos inside the logo circle. */
.pt-sun { position: relative; overflow: hidden; background: var(--zs-sand); color: var(--zs-ink); isolation: isolate; }
.pt-sun::before { content: ""; position: absolute; z-index: -1; right: -12vw; top: -22vw; width: 62vw; height: 62vw; border-radius: 50%; background: radial-gradient(circle at 40% 40%, rgba(255, 197, 46, 0.45), rgba(247, 147, 30, 0.18) 45%, transparent 70%); }
.pt-sun::after { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 90px; background: linear-gradient(transparent, rgba(11, 107, 211, 0.06)); }
.pt-sun-inner { max-width: 1240px; margin: 0 auto; padding: clamp(36px, 6vw, 84px) var(--zs-gutter) clamp(48px, 7vw, 96px); display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(28px, 5vw, 72px); align-items: center; }
.pt-sun-copy .zs-eyebrow { color: var(--zs-gold); }
.pt-sun h1 { margin: 0 0 18px; color: var(--zs-navy); font: 600 clamp(36px, 5vw, 64px)/1.08 var(--zs-display); letter-spacing: -0.015em; text-wrap: balance; }
.pt-sun .zs-hero-lead { margin: 0 0 28px; max-width: 520px; color: var(--zs-muted); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; }
.pt-sun .zs-search { box-shadow: 0 20px 50px rgba(10, 45, 94, 0.14); border: 1px solid var(--zs-line); }
.pt-sun-copy > * { opacity: 0; transform: translateY(16px); animation: zs-rise 0.9s var(--zs-ease) forwards; }
.pt-sun-copy > :nth-child(2) { animation-delay: 0.1s; }
.pt-sun-copy > :nth-child(3) { animation-delay: 0.2s; }
.pt-sun-copy > :nth-child(4) { animation-delay: 0.3s; }
.pt-sun-copy > :nth-child(5) { animation-delay: 0.4s; }
.pt-sun-art { position: relative; justify-self: center; width: min(100%, 520px); }
.pt-sun-art::before { content: ""; position: absolute; inset: -14px; bottom: auto; aspect-ratio: 1; border-radius: 50%; border: 2px dashed rgba(247, 147, 30, 0.55); animation: pt-turn 60s linear infinite; }
.pt-sun-disc { position: relative; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--pt-sun); box-shadow: 0 40px 80px rgba(10, 45, 94, 0.22); }
.pt-sun-disc .zs-stage-slide { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; opacity: 0; transform: scale(1.04); transition: opacity 1.4s ease, transform 8s linear; }
.pt-sun-disc .zs-stage-slide.is-active { opacity: 1; transform: scale(1.12); }
.pt-sun-waves { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 26%; display: block; }
.pt-sun-waves path { animation: pt-swell 7s ease-in-out infinite alternate; transform-origin: 50% 100%; }
.pt-sun-waves path:nth-child(2) { animation-delay: -2s; }
.pt-sun-waves path:nth-child(3) { animation-delay: -4s; }
.pt-sun-caps { position: static; display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 14px; margin: 22px 0 0; padding: 0; list-style: none; }
.pt-sun-caps li { display: flex; flex-direction: column; gap: 6px; width: 64px; }
.pt-sun-caps .zs-stage-bar { display: block; height: 3px; border-radius: 3px; background: rgba(10, 45, 94, 0.14); overflow: hidden; }
.pt-sun-caps .zs-stage-bar span { display: block; height: 100%; width: 0; background: var(--pt-sun); }
.pt-sun-caps li.is-active .zs-stage-bar span { animation: pt-bar var(--zs-stage-ms, 6000ms) linear forwards; }
.pt-sun-caps .zs-stage-cap { display: none; }
@keyframes pt-turn { to { transform: rotate(360deg); } }
@keyframes pt-swell { from { transform: translateY(0) scaleY(1); } to { transform: translateY(4px) scaleY(1.06); } }
@keyframes pt-bar { from { width: 0; } to { width: 100%; } }
@media (max-width: 900px) {
	.pt-sun-inner { grid-template-columns: 1fr; padding-top: 28px; }
	.pt-sun-art { order: -1; width: min(78vw, 360px); }
	.pt-sun-art::before { inset: -10px; bottom: auto; }
	.pt-sun-caps { margin-top: 16px; }
	.pt-sun h1 { font-size: clamp(32px, 8.4vw, 44px); }
}
@media (prefers-reduced-motion: reduce) {
	.pt-sun-art::before, .pt-sun-waves path { animation: none; }
	.pt-sun-copy > * { opacity: 1; transform: none; animation: none; }
}

/* Trip card — white, orange price, sun "Book" on hover. */
.zs-tc { border-radius: 20px; box-shadow: 0 1px 0 var(--zs-line), 0 12px 30px rgba(10, 45, 94, 0.08); }
.zs-tc-meta svg { color: var(--zs-gold-2); }
.zs-tc-price b { color: var(--zs-gold); }
.zs-tc-book { background: var(--zs-navy); color: #fff; }
@media (hover: hover) { .zs-tc:hover .zs-tc-book { background: var(--pt-sun); color: var(--zs-navy); } }

/* Footer — deep sea with the light logo; sun line on top. */
.zs-footer { background: #071F44; border-top: 0; position: relative; }
.zs-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--pt-sun); }
.zs-footer .zs-brand-mark { height: 64px !important; }
.zs-footer-col h2 { color: #FFC52E; }
.zs-socials a { border-color: rgba(255, 197, 46, 0.4); color: #FFC52E; }
@media (hover: hover) { .zs-footer a:hover { color: #FFC52E; } }
.zs-credit a { color: #FFC52E; }

/* Reviews before any review text is stored: one panel pointing to Google. */
.pt-rev-empty { padding: clamp(48px, 7vw, 88px) 0; }
.pt-rev-card { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; padding: clamp(24px, 4vw, 40px); border-radius: 24px; background: var(--zs-sand); border: 1px solid var(--zs-line); }
.pt-rev-card h2 { margin: 0 0 8px; color: var(--zs-navy); font: 600 clamp(26px, 3vw, 38px)/1.15 var(--zs-display); }
.pt-rev-card p:not(.zs-eyebrow) { margin: 0; max-width: 560px; color: var(--zs-muted); }
.pt-rev-card .zs-btn svg { background: #fff; border-radius: 50%; padding: 2px; }
