/*
Theme Name: Sapardanis Studio (Whizz Child)
Description: Child theme του Whizz — σελίδα portfolio Sapardanis Studio. Όλα τα styles είναι scoped κάτω από .sap / body.sap-page ώστε να μην επηρεάζουν το υπόλοιπο site.
Template: whizz
Version: 2.1.1
Text Domain: sapardanis-child
*/

/* =========================================================================
   ΠΕΡΙΕΧΟΜΕΝΑ
   1. Tokens
   2. Σελίδα (full-bleed, reset του parent)
   3. Βάση & core-block reset
   4. Τυπογραφία
   5. Layout (sections / cols / stacks)
   6. Header + menu overlay
   7. Hero
   8. Bands
   9. Portfolio gallery + trios
  10. Process
  11. Πακετα
  12. Υπηρεσιες / Αλμπουμ / FAQ
  13. Αξιες / Επικοινωνια / Footer
  14. Motion (reveals, parallax, reduced-motion)
  15. Responsive
  16. Parent-theme chrome
   ========================================================================= */


/* ============ 1. TOKENS ============ */
.sap {
  --sap-bg: #0a0a0a;
  --sap-bg-2: #131313;
  --sap-ink: #ededed;
  --sap-ink-2: #a8a8a8;
  --sap-ink-3: #949494;
  --sap-ink-4: #8c8c8c;
  --sap-ink-5: #7e7e7e;
  --sap-ink-6: #b9b9b9;
  --sap-line: rgba(255,255,255,0.09);
  --sap-paper: #f2f2f0;
  --sap-pad: clamp(18px, 4.5vw, 64px);
  --sap-sect: clamp(64px, 12vh, 150px);
  --sap-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* --sap-vw: πλάτος viewport χωρίς τη μπάρα κύλισης (το γράφει inline script).
   --sap-anchor: πόσο πιο ψηλά να σταματά το scroll στα anchors. Η σελίδα δεν
   έχει δικό της header· αν το Whizz έχει sticky header, βάλε εδώ το ύψος του. */
:root { --sap-anchor: 0px; --sap-vw: 100vw; }


/* ============ 2. ΣΕΛΙΔΑ ============ */
body.sap-page { background: #0a0a0a; }

/* Ο καμβάς του template μας. */
body.sap-page .sap-main { max-width: none; width: auto; margin: 0; padding: 0; overflow-x: clip; }

/* Συνηθισμένα wrappers των classic themes — τα ισοπεδώνουμε ΜΟΝΟ σε αυτή τη σελίδα. */
body.sap-page #content,
body.sap-page #primary,
body.sap-page .site-content,
body.sap-page .content-area,
body.sap-page .entry-content,
body.sap-page .entry-content > * { max-width: none; width: auto; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }

body.sap-page .entry-title,
body.sap-page .page-title,
body.sap-page .entry-header,
body.sap-page .breadcrumb,
body.sap-page .breadcrumbs { display: none; }

/* Full-bleed: ακυρώνει όποιο container/padding βάζει το parent theme.
   Το --sap-vw είναι το πλάτος ΧΩΡΙΣ τη μπάρα κύλισης (το γράφει inline script
   στο <head>). Με σκέτο 50vw η σελίδα θα έβγαινε ~15px φαρδύτερη από το design
   και θα ξεχείλιζε οριζόντια. Αν το parent theme δεν βάζει container, το
   calc() βγαίνει 0 και δεν μετακινείται τίποτα. */
/* Το min(0px, …) είναι δικλείδα ασφαλείας: το bleed επιτρέπεται μόνο να
   ΦΑΡΔΑΙΝΕΙ. Αν το --sap-vw λείπει ή βγει 0 (συμβαίνει όταν κάποιο plugin ή το
   page-transition του parent μετρά τη σελίδα πριν έχει layout), χωρίς αυτό η
   σελίδα θα έπαιρνε margin 50% δεξιά κι αριστερά και θα γινόταν πλάτος 0. */
body.sap-page .sap {
  width: auto; max-width: none;
  margin-left: min(0px, calc(50% - var(--sap-vw) / 2));
  margin-right: min(0px, calc(50% - var(--sap-vw) / 2));
}

/* Anchors κάτω από τον sticky header (+ admin bar). */
.sap [id] { scroll-margin-top: var(--sap-anchor); }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }


/* ============ 3. ΒΑΣΗ & CORE-BLOCK RESET ============ */
.sap {
  color: var(--sap-ink);
  background: var(--sap-bg);
  font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
}
.sap * { box-sizing: border-box; }

/* Νικάει τους κανόνες του parent theme για τα inline/block στοιχεία. */
.sap h1, .sap h2, .sap h3, .sap h4, .sap p, .sap li, .sap span, .sap a, .sap b, .sap i, .sap em,
.sap small, .sap button, .sap blockquote, .sap figcaption { font-family: 'Jost', 'Helvetica Neue', Arial, sans-serif; }

.sap h1, .sap h2, .sap h3, .sap h4 { font-weight: 200; }
.sap ::selection { background: #2a2a2a; }
.sap a { color: var(--sap-ink); text-decoration: none; }
.sap a:hover { color: #fff; }

.sap p, .sap ul, .sap ol, .sap figure, .sap h1, .sap h2, .sap h3, .sap h4, .sap blockquote { margin: 0; }
.sap .wp-block-group,
.sap .wp-block-columns,
.sap .wp-block-column,
.sap .wp-block-image,
.sap .wp-block-list,
.sap .wp-block-quote { margin: 0; }
.sap .wp-block-image img { display: block; }

/* ΚΡΙΣΙΜΟ — inner container.
   Το Whizz είναι classic theme χωρίς theme.json, οπότε το WordPress τυλίγει τα
   παιδιά ΚΑΘΕ Group block σε <div class="wp-block-group__inner-container">
   (wp_restore_group_inner_container). Χωρίς αυτή τη γραμμή, τα grid/flex μας
   εφαρμόζονται στο εξωτερικό div ενώ τα παιδιά κάθονται ένα επίπεδο πιο μέσα:
   οι στήλες γίνονται μία, το process πλέγμα γίνεται στοίβα κ.ο.κ.
   Το display:contents βγάζει το ενδιάμεσο div από το layout. Σε theme με
   theme.json ο wrapper δεν υπάρχει καν, οπότε ο κανόνας είναι αβλαβής. */
.sap .wp-block-group__inner-container { display: contents; }

/* ΚΡΙΣΙΜΟ — line-height.
   Το Whizz ορίζει σταθερό line-height (26px) σε p/li. Το design χρησιμοποιεί
   `normal` παντού εκτός από τα σημεία που το δηλώνει ρητά, οπότε μηδενίζουμε
   εδώ και το ξαναδηλώνουμε στην ενότητα 4. Χωρίς αυτό κάθε kicker/label/τιμή
   ψήλωνε ~11px και οι ενότητες ξέφευγαν έως και 70px. */
.sap p, .sap li, .sap ul, .sap ol,
.sap h1, .sap h2, .sap h3, .sap h4,
.sap span, .sap a, .sap b, .sap i, .sap em, .sap small,
.sap blockquote, .sap figcaption { line-height: normal; }
/* Τα li των λιστών παίρνουν το line-height της λίστας τους. */
.sap ul.sap-plan__list li,
.sap ul.sap-values__list li { line-height: inherit; }
.sap .wp-block-quote { border: 0; padding: 0; }
.sap .wp-block-quote cite { display: none; }


/* ============ 4. ΤΥΠΟΓΡΑΦΙΑ ============ */
/* kicker — οι παραλλαγές είναι ακριβώς οι τιμές του design */
.sap .sap-kicker         { display: block; font-size: 10px; letter-spacing: 0.44em; text-transform: uppercase; color: var(--sap-ink); }
.sap .sap-kicker--hero   { font-size: 9px;   letter-spacing: 0.5em;  color: var(--sap-ink-6); }
.sap .sap-kicker--muted  { font-size: 10px;  letter-spacing: 0.3em;  color: var(--sap-ink-4); }
.sap .sap-kicker--tight  { font-size: 10px;  letter-spacing: 0.3em;  color: var(--sap-ink); }
.sap .sap-kicker--label  { font-size: 10px;  letter-spacing: 0.28em; color: var(--sap-ink-5); }
.sap .sap-kicker--fine   { font-size: 10px;  letter-spacing: 0.24em; color: var(--sap-ink-5); }
.sap .sap-kicker--dim    { font-size: 10px;  letter-spacing: 0.44em; color: var(--sap-ink-5); }
.sap .sap-kicker--big    { font-size: 12px;  letter-spacing: 0.3em;  color: var(--sap-ink-4); }
.sap .sap-kicker--lead   { font-size: 11px;  letter-spacing: 0.3em;  color: var(--sap-ink-6); }
.sap .sap-kicker--meta   { font-size: 9.5px; letter-spacing: 0.34em; color: var(--sap-ink-4); }

.sap .sap-h1 { font-weight: 200; font-size: clamp(28px, 4.6vw, 58px); line-height: 1.22; letter-spacing: 0.06em; text-wrap: pretty; }
.sap .sap-h2 { font-weight: 200; font-size: clamp(24px, 3.2vw, 40px); line-height: 1.28; letter-spacing: 0.09em; }
.sap .sap-h2--caps { font-size: clamp(24px, 3.4vw, 42px); line-height: 1.26; text-transform: uppercase; }
.sap .sap-h2--loose { line-height: normal; }

.sap .sap-lead { font-weight: 200; font-size: clamp(17px, 1.8vw, 22px); line-height: 1.6; letter-spacing: 0.04em; color: var(--sap-ink); }
.sap .sap-lead--caps { font-size: clamp(16px, 1.7vw, 21px); letter-spacing: 0.05em; text-transform: uppercase; }

.sap .sap-body { font-size: 14px; line-height: 1.95; letter-spacing: 0.02em; color: var(--sap-ink-2); text-align: justify; }
.sap .sap-body--sm { font-size: 13px; line-height: 1.9; }
.sap .sap-body--left { text-align: left; max-width: 48ch; font-size: 13.5px; line-height: 1.9; }

.sap .sap-quote { font-weight: 200; font-size: clamp(19px, 2.6vw, 34px); line-height: 1.45; letter-spacing: 0.05em; text-wrap: pretty; }
.sap .sap-quote--center { font-size: clamp(19px, 2.4vw, 32px); line-height: 1.5; }

.sap .sap-note { display: block; font-size: 11px; line-height: normal; letter-spacing: 0.08em; color: var(--sap-ink-4); }
.sap .sap-note--hour { font-size: 11.5px; letter-spacing: 0.06em; }
.sap .sap-note--multi { line-height: 1.7; }


/* ============ 5. LAYOUT ============ */
.sap .sap-sect { padding: var(--sap-sect) var(--sap-pad); }
.sap .sap-sect--dark { background: var(--sap-bg-2); }
/* Στο design το max-width είναι πλάτος ΠΕΡΙΕΧΟΜΕΝΟΥ (content-box), οπότε το
   padding προστίθεται. Με border-box πρέπει να το προσθέσουμε εμείς. */
.sap .sap-sect--narrow { max-width: calc(1100px + 2 * var(--sap-pad)); margin: 0 auto; padding: clamp(56px, 11vh, 130px) var(--sap-pad); }
.sap .sap-wrap { max-width: 1500px; margin: 0 auto; }

.sap .sap-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: clamp(30px, 5vw, 84px); align-items: start; }
.sap .sap-cols--tight { grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); gap: clamp(28px, 4.5vw, 70px); }
.sap .sap-cols--svc   { gap: clamp(30px, 5vw, 80px); }

.sap .sap-stack { display: flex; flex-direction: column; gap: 22px; }
.sap .sap-stack--16 { gap: 16px; }
.sap .sap-stack--18 { gap: 18px; }
.sap .sap-stack--20 { gap: 20px; }
.sap .sap-stack--24 { gap: 24px; }
.sap .sap-stack--26 { gap: 26px; }
.sap .sap-stack--28 { gap: 28px; }
.sap .sap-stack--process { gap: clamp(34px, 5vh, 60px); }
.sap .sap-stack--plans   { gap: clamp(30px, 5vh, 54px); }
.sap .sap-stack--faq     { gap: clamp(30px, 5vh, 52px); }

.sap .sap-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-bottom: 24px; border-bottom: 1px solid var(--sap-line); }
.sap .sap-head--gap { margin-bottom: clamp(26px, 4vh, 46px); }


/* ============ 7. HERO ============ */
.sap .sap-hero { position: relative; height: clamp(480px, 88vh, 900px); overflow: hidden; background: var(--sap-bg); }
.sap .sap-hero__img { position: absolute; inset: 0; }
.sap .sap-hero__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; animation: sapKb 22s ease-out both alternate infinite; }
.sap .sap-hero::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(10,10,10,0.94) 0%, rgba(10,10,10,0.34) 46%, rgba(10,10,10,0.5) 100%); }
.sap .sap-hero__copy { position: absolute; z-index: 2; left: var(--sap-pad); right: var(--sap-pad); bottom: clamp(38px, 8vh, 92px); display: flex; flex-direction: column; gap: 22px; max-width: 940px; }
.sap .sap-hero__sub { max-width: 44ch; font-size: 14px; line-height: 1.8; letter-spacing: 0.03em; color: var(--sap-ink-2); }


/* ============ 8. BANDS ============ */
.sap .sap-band { position: relative; overflow: hidden; background: var(--sap-bg); }
.sap .sap-band__img img { width: 100%; height: clamp(300px, 62vh, 700px); object-fit: cover; object-position: 50% 45%; opacity: 0.9; will-change: transform; }
.sap .sap-band--short .sap-band__img img { height: clamp(260px, 48vh, 520px); object-position: 50% 50%; }
.sap .sap-band::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to right, rgba(10,10,10,0.9) 0%, rgba(10,10,10,0.3) 58%, rgba(10,10,10,0.1) 100%); }
.sap .sap-band--short::after { background: linear-gradient(to top, rgba(10,10,10,0.86), rgba(10,10,10,0.24)); }
/* top:50% + margin-top:-1em όπως το design — χωρίς transform, ώστε να μη συγκρούεται με το reveal. */
.sap .sap-band .sap-quote { position: absolute; z-index: 2; left: var(--sap-pad); right: var(--sap-pad); top: 50%; margin-top: -1em; max-width: 640px; }


/* ============ 9. GALLERY + TRIOS ============ */
/* Το core gallery είναι flex· εδώ γίνεται grid 3 στηλών όπως το design.
   Τα !important σπάνε τον κανόνα :not(#individual-image) του πυρήνα — δεν γίνεται αλλιώς. */
.sap .wp-block-gallery.sap-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 1.1vw, 16px); }
.sap .wp-block-gallery.sap-grid > figure.wp-block-image {
  width: auto !important; max-width: none !important; margin: 0 !important; flex: none !important;
  background: #121212; overflow: hidden; aspect-ratio: 4 / 5;
}
.sap .wp-block-gallery.sap-grid > figure.wp-block-image img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.1s var(--sap-ease);
}
.sap .wp-block-gallery.sap-grid > figure.wp-block-image:hover img { transform: scale(1.05); }
.sap .wp-block-gallery.sap-grid figcaption { display: none; }

.sap .sap-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, 1vw, 14px); }
.sap .sap-trio--sm { gap: clamp(6px, 0.8vw, 12px); margin-top: 4px; }
.sap .sap-trio img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; }
.sap .sap-trio--bw img { filter: grayscale(1); }

.sap .sap-figure { margin-top: 6px; }
.sap .sap-figure img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }


/* ============ 10. PROCESS ============ */
.sap .sap-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 1px; background: var(--sap-line); }
/* Το design δεν έχει border-box, οπότε το min-height:172px του είναι το ΥΨΟΣ
   ΠΕΡΙΕΧΟΜΕΝΟΥ. Εδώ το ξαναφτιάχνουμε ρητά, για να βγει ίδιο κελί (232px). */
.sap .sap-step { --sap-step-pad: clamp(20px, 2.2vw, 30px); background: var(--sap-bg-2); padding: var(--sap-step-pad); display: flex; flex-direction: column; gap: 12px; min-height: calc(172px + 2 * var(--sap-step-pad)); }
.sap .sap-step__t { font-size: 9.5px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--sap-ink); }
.sap .sap-step__b { font-size: 12.5px; line-height: 1.85; letter-spacing: 0.02em; color: var(--sap-ink-3); }


/* ============ 11. ΠΑΚΕΤΑ ============ */
.sap .sap-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); gap: clamp(14px, 1.6vw, 22px); align-items: start; }
.sap .sap-plan { background: var(--sap-bg-2); border: 1px solid rgba(255,255,255,0.06); padding: clamp(24px, 2.6vw, 38px); display: flex; flex-direction: column; gap: 20px; }
.sap .sap-plan--extras { gap: 28px; }
.sap .sap-plan__label { font-size: 9.5px; letter-spacing: 0.34em; text-transform: uppercase; color: var(--sap-ink-5); }
.sap .sap-plan__price { font-weight: 200; font-size: 34px; letter-spacing: 0.06em; color: var(--sap-ink); }
.sap ul.sap-plan__list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 14px; font-size: 13px; line-height: 1.7; letter-spacing: 0.02em; color: var(--sap-ink-6); }
.sap ul.sap-plan__list li { margin: 0; }
/* Η υποσημείωση μέσα στο li: γράφεται ως πλάγιο (Ctrl/Cmd+I) μετά από αλλαγή
   γραμμής (Shift+Enter) και βγαίνει μικρή και όρθια. Μένει inline επίτηδες. */
.sap ul.sap-plan__list em { font-style: normal; font-size: 11.5px; line-height: 1.7; letter-spacing: 0.02em; color: var(--sap-ink-5); }

.sap .sap-plan--paper { background: var(--sap-paper); color: #131313; border: 0; }
.sap .sap-plan--paper .sap-plan__label { color: #4a4a4a; }
.sap .sap-plan--paper .sap-plan__price { color: #131313; }
.sap .sap-plan--paper ul.sap-plan__list { color: #2e2e2e; }
.sap .sap-plan--paper ul.sap-plan__list em { color: #5a5a5a; }
.sap .sap-plan--paper .sap-note { font-size: 10.5px; color: #5a5a5a; }
.sap .sap-plan--paper .sap-note--hour { font-size: 11.5px; color: #4a4a4a; }

.sap .sap-extra { display: flex; flex-direction: column; gap: 8px; }
.sap .sap-extra__t { font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--sap-ink); }
.sap .sap-extra__v { font-size: 13px; letter-spacing: 0.02em; color: var(--sap-ink-6); }
.sap .sap-extra .sap-note--hour { letter-spacing: 0.04em; }


/* ============ 12. ΥΠΗΡΕΣΙΕΣ / ΑΛΜΠΟΥΜ / FAQ ============ */
.sap .sap-item { display: flex; flex-direction: column; gap: 8px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,0.07); }
.sap .sap-item__t { font-size: 9.5px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--sap-ink); }
.sap .sap-item__b { font-size: 12.5px; line-height: 1.85; letter-spacing: 0.02em; color: var(--sap-ink-3); }

.sap .sap-rows { display: flex; flex-direction: column; gap: 1px; background: var(--sap-line); }
.sap .sap-row { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 12px; align-items: baseline; background: var(--sap-bg); padding: 14px 16px; }
.sap .sap-sect--dark .sap-row { background: var(--sap-bg-2); }
.sap .sap-row p { font-size: 12px; letter-spacing: 0.04em; }
.sap .sap-row__k { color: var(--sap-ink-6); }
.sap .sap-row__d { color: var(--sap-ink-4); }
.sap .sap-row__p { color: var(--sap-ink); text-align: right; }

.sap .sap-faq { columns: 2 320px; column-gap: clamp(30px, 5vw, 80px); }
.sap .sap-qa { break-inside: avoid; display: flex; flex-direction: column; gap: 8px; padding-bottom: 26px; }
.sap .sap-qa__q { font-size: 13px; letter-spacing: 0.03em; color: var(--sap-ink); }
.sap .sap-qa__a { font-size: 12.5px; line-height: 1.9; letter-spacing: 0.02em; color: var(--sap-ink-3); text-align: justify; }


/* ============ 13. ΑΞΙΕΣ / ΕΠΙΚΟΙΝΩΝΙΑ / FOOTER ============ */
.sap .sap-values { display: flex; flex-direction: column; align-items: center; gap: 26px; text-align: center; }
.sap ul.sap-values__list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 14px; max-width: 64ch; font-weight: 200; font-size: clamp(14px, 1.5vw, 19px); line-height: 1.6; letter-spacing: 0.07em; color: #d8d8d8; }
.sap ul.sap-values__list li { margin: 0; }

.sap .sap-contact { position: relative; overflow: hidden; background: var(--sap-bg); }
.sap .sap-contact__bg { position: absolute; inset: 0; }
.sap .sap-contact__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; opacity: 0.28; }
.sap .sap-contact__inner {
  position: relative; z-index: 1;
  padding: clamp(64px, 13vh, 160px) var(--sap-pad);
  max-width: calc(1500px + 2 * var(--sap-pad)); margin: 0 auto;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: clamp(30px, 5vw, 80px); align-items: end;
  background: linear-gradient(to bottom, rgba(10,10,10,0.72), rgba(10,10,10,0.9));
}
.sap .sap-btn-wrap { display: flex; }
.sap a.sap-btn { display: inline-block; font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; padding: 15px 30px; border: 1px solid rgba(255,255,255,0.5); color: var(--sap-ink); transition: background 0.4s ease, color 0.4s ease, border-color 0.4s ease; }
.sap a.sap-btn:hover { background: var(--sap-paper); color: #131313; border-color: var(--sap-paper); }
.sap .sap-contact__logo img { width: 54px; height: auto; opacity: 0.9; }
.sap .sap-contact__logo { margin-bottom: 8px; }
.sap .sap-contact__line { font-size: 15px; letter-spacing: 0.1em; }
.sap .sap-note--foot { padding-top: 8px; line-height: 1.8; letter-spacing: 0.06em; }

.sap .sap-foot { display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; padding: 24px var(--sap-pad) 40px; border-top: 1px solid var(--sap-line); }
.sap .sap-foot p { font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--sap-ink-4); }


/* ============ 14. MOTION ============ */
@keyframes sapFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes sapRise { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes sapKb { from { transform: scale(1.06); } to { transform: scale(1.14); } }

/* Είσοδος σελίδας: το design τα κάνει με keyframes, όχι με observer. */
.sap .sap-hero__copy .sap-kicker { animation: sapRise 1s var(--sap-ease) 0.2s both; }
.sap .sap-hero__copy .sap-h1 { animation: sapRise 1.2s var(--sap-ease) 0.36s both; }
.sap .sap-hero__copy .sap-hero__sub { animation: sapRise 1.2s var(--sap-ease) 0.6s both; }

/* Το .sap-js μπαίνει από inline script στο <head>. Χωρίς JS (και μέσα στον editor)
   όλα είναι ορατά — δεν «εξαφανίζεται» ποτέ περιεχόμενο. */
.sap-js .sap .sap-reveal {
  opacity: 0; transform: translateY(28px);
  transition: opacity 1s var(--sap-ease), transform 1s var(--sap-ease);
}
.sap-js .sap .sap-reveal.is-in { opacity: 1; transform: none; }
.sap-js .sap .sap-reveal--slow { transition-duration: 1.1s; }
.sap-js .sap .sap-reveal--slower { transition-duration: 1.2s; }
.sap-js .sap .sap-reveal--fast { transition-duration: 0.85s; }
.sap-js .sap .sap-reveal--tile { transform: translateY(30px); transition-duration: 0.95s; }
.sap-js .sap .sap-reveal--sm { transform: translateY(20px); }
.sap-js .sap .sap-reveal--xs { transform: translateY(22px); }
.sap-js .sap .sap-d90  { transition-delay: 90ms; }
.sap-js .sap .sap-d120 { transition-delay: 120ms; }
.sap-js .sap .sap-d180 { transition-delay: 180ms; }

@media (prefers-reduced-motion: reduce) {
  .sap-js .sap .sap-reveal { opacity: 1; transform: none; transition: none; }
  .sap .sap-hero__copy .sap-kicker,
  .sap .sap-hero__copy .sap-h1,
  .sap .sap-hero__copy .sap-hero__sub,
  .sap .sap-hero__img img { animation: none; }
  .sap .wp-block-gallery.sap-grid > figure.wp-block-image img { transition: none; }
  .sap .wp-block-gallery.sap-grid > figure.wp-block-image:hover img { transform: none; }
}


/* ============ 15. RESPONSIVE ============ */
@media (max-width: 900px) {
  .sap .sap-band .sap-quote { right: var(--sap-pad); max-width: none; }
}
@media (max-width: 640px) {
  .sap .sap-body, .sap .sap-qa__a { text-align: left; }
  .sap .sap-row { grid-template-columns: 1fr auto; }
  .sap .sap-row__d { display: none; }
  .sap .sap-plan__price { font-size: 30px; }
  .sap .sap-band .sap-quote { top: auto; bottom: clamp(24px, 6vh, 48px); margin-top: 0; }
}
/* ============ 16. PARENT-THEME CHROME ============
   Ο header του Whizz μένει όπως είναι — η σελίδα δεν έχει δικό της.
   Κρύβεται μόνο ο footer του, επειδή η ενότητα 11 φέρνει δικό της footer.
   Αν το Whizz χρησιμοποιεί άλλα class names, πρόσθεσέ τα στη λίστα· αν
   θέλεις και τον δικό του footer, σβήσε αυτόν τον κανόνα. */
body.sap-page .site-footer,
body.sap-page #colophon { display: none; }