/* ==========================================================================
   Platis Group – Global CSS (merged)
   File: /static/styles.css
   ========================================================================== */

/* ===== CSS Reset (lightweight) ===== */
*,
*::before,
*::after { box-sizing: border-box; }
html:focus-within { scroll-behavior: smooth; }
html, body { height: 100%; }
body, h1, h2, h3, h4, p, figure, blockquote, dl, dd { margin: 0; }
ul[role='list'], ol[role='list'] { list-style: none; }
img, picture { max-width: 100%; display: block; }
input, button, textarea, select { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }

/* ===== Root tokens ===== */
:root{
  --pg-bg: #ffffff;
  --pg-fg: #0a0a0a;
  --pg-muted: #5f5f5f;
  --pg-border: #e5e5e5;
  --pg-ink-20: #d9d9d9;
  --pg-ink-10: #f2f2f2;

  --pg-maxw: 1120px;

  /* Manrope as primary sans with Greek support */
  --pg-font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --pg-space-1: 4px;
  --pg-space-2: 8px;
  --pg-space-3: 12px;
  --pg-space-4: 16px;
  --pg-space-5: 20px;
  --pg-space-6: 24px;
  --pg-space-8: 32px;
  --pg-space-10: 40px;
  --pg-space-12: 48px;
  --pg-space-16: 64px;

  --pg-radius-1: 6px;
  --pg-radius-2: 12px;

  --pg-shadow-0: 0 1px 0 rgba(0,0,0,0.06);
  --pg-shadow-1: 0 2px 10px rgba(0,0,0,0.06);
  --pg-shadow-2: 0 6px 24px rgba(0,0,0,0.08);

  /* Extras used by page CSS */
  --pg-logo-h: 36px;
  --pg-surface: #ffffff;              /* used in our-hotels cards */
  --pg-ease: cubic-bezier(.22,.61,.36,1); /* shared easing */
}

/* ===== Base ===== */
body.pg{
  background: var(--pg-bg);
  color: var(--pg-fg);
  font-family: var(--pg-font-sans);
  font-weight: 400;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.pg .pg-container{
  max-width: var(--pg-maxw);
  margin-inline: auto;
  padding-inline: var(--pg-space-4);
}

/* ===== Typography ===== */
.pg .pg-h2{
  font-size: clamp(24px, 2.6vw, 32px);
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.pg .pg-h3{
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.3;
  font-weight: 700;
}

.pg p{ color: var(--pg-fg); }

.pg .pg-link{
  position: relative;
  display: inline-block;
  font-weight: 600;
}
.pg .pg-link::after{
  content:"";
  position:absolute;
  left:0; bottom:-2px;
  width:100%; height:1px;
  background: currentColor;
  transform-origin: left;
  transform: scaleX(0.3);
  transition: transform .2s ease;
}

/* ===== Header ===== */
.pg-header{
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.85);
  -webkit-backdrop-filter: saturate(150%) blur(4px);
  backdrop-filter: saturate(150%) blur(4px);
  border-bottom: 1px solid var(--pg-border);
}
.pg-header__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  gap: var(--pg-space-4);
}

/* Logo (anchor + image) */
.pg-logo{
  font-weight: 800;
  letter-spacing: 0.01em;
  padding: 0;
  border-radius: 0;
}
.pg-logo__img{
  display: block;
  height: var(--pg-logo-h);
  width: auto;
}

/* Nav */
.pg-nav{
  display: flex;
  gap: var(--pg-space-6);
  align-items: center;
}
.pg-nav__link{
  font-size: 14.5px;
  color: var(--pg-muted);
  position: relative;
  font-weight: 600;
  padding-block: 8px;
  transition: color .16s ease;
}
.pg-nav__link:focus-visible{
  outline: 2px solid var(--pg-fg);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ===== Hero ===== */
.pg-hero{
  padding-block: clamp(56px, 10vw, 120px);
  border-bottom: 1px solid var(--pg-border);
}
.pg-hero__title{
  font-size: clamp(32px, 5.6vw, 56px);
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.pg-hero__lead{
  margin-top: var(--pg-space-4);
  color: var(--pg-muted);
  font-size: clamp(14px, 1.6vw, 16px);
  font-weight: 500;
}
.pg-hero__cta{ margin-top: var(--pg-space-6); }

/* ===== Buttons ===== */
.pg-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 16px;
  border: 1px solid var(--pg-fg);
  border-radius: var(--pg-radius-2);
  background: var(--pg-fg);
  color: var(--pg-bg);
  font-weight: 800;
  letter-spacing: 0.01em;
  transition: transform .06s ease, background .16s ease, box-shadow .16s ease;
  box-shadow: var(--pg-shadow-0);
}
.pg-btn:focus-visible{
  outline: 2px solid var(--pg-fg);
  outline-offset: 2px;
}
.pg-btn--ghost{
  background: transparent;
  color: var(--pg-fg);
}

/* ===== Sections ===== */
.pg-section{
  padding-block: clamp(40px, 8vw, 88px);
  border-bottom: 1px solid var(--pg-border);
}
.pg-section--stripe{
  background: linear-gradient(to bottom, transparent, #fafafa 60%, transparent);
}
.pg-section__head{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--pg-space-4);
  margin-bottom: var(--pg-space-6);
}

/* ===== Grid / Cards ===== */
.pg-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--pg-space-6);
}
@media (max-width: 960px){
  .pg-grid{ gap: var(--pg-space-4); }
}
.pg-card{
  grid-column: span 4;
  border: 1px solid var(--pg-border);
  border-radius: var(--pg-radius-2);
  padding: var(--pg-space-5);
  background: var(--pg-bg);
  transition: box-shadow .2s ease, transform .2s ease;
}
@media (max-width: 960px){
  .pg-card{ grid-column: span 6; }
}
@media (max-width: 640px){
  .pg-card{ grid-column: 1 / -1; }
}
.pg-card__media{
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: var(--pg-space-4);
  background: #f6f6f6;
}
.pg-card__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform .35s ease;
}
.pg-card__header{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--pg-space-3);
  margin-bottom: var(--pg-space-3);
}
.pg-card__meta{
  color: var(--pg-muted);
  font-size: 13px;
}
.pg-card__body{
  color: var(--pg-fg);
  margin-bottom: var(--pg-space-5);
}
.pg-card__footer{
  display: flex;
  gap: var(--pg-space-3);
}

/* ===== Split & Contact tease ===== */
.pg-split{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--pg-space-8);
}
@media (max-width: 840px){
  .pg-split{ grid-template-columns: 1fr; }
}
.pg-contact-tease{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pg-space-6);
}
@media (max-width: 720px){
  .pg-contact-tease{ flex-direction: column; align-items: flex-start; }
}

/* ===== Footer stacked layout ===== */
.pg-footer{
  border-top: 1px solid var(--pg-border);
  background: var(--pg-bg);
}
.pg-footer__inner{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--pg-space-4);
  padding-block: var(--pg-space-8);
  text-align: center;
}
.pg-footer__brand{
  font-weight: 800;
  letter-spacing: 0.01em;
}
.pg-footer__nav{
  display: flex;
  flex-wrap: wrap;
  gap: var(--pg-space-6);
  justify-content: center;
}
.pg-footer__nav a{
  font-size: 14px;
  color: var(--pg-muted);
  font-weight: 600;
  line-height: 1.2;
}
.pg-footer__nav a:hover{ text-decoration: underline; }
.pg-footer__legal{
  font-size: 13px;
  color: var(--pg-muted);
}

/* ===== Global Font Awesome “ασφάλεια” (moved from contact) ===== */
/* Ensures FA weights/families aren’t overridden by page CSS  */
.pg .fa,
.pg .fa-solid,
.pg .fa-regular {
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 400 !important;   /* base weight */
  font-style: normal !important;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.pg .fa-solid { font-weight: 900 !important; }
.pg .fa-brands {
  font-family: "Font Awesome 6 Brands" !important;
  font-weight: 400 !important;
  font-style: normal !important;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.pg .fa-fw { width: 1.25em; text-align: center; }
.pg .fa::before { display: inline-block; }
.pg i.fa,
.pg i[class^="fa-"],
.pg i[class*=" fa-"] { display: inline-block; line-height: 1; overflow: visible; }

/* ===== Accessibility & motion ===== */
:focus-visible{
  outline: 2px solid var(--pg-fg);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===== Helpers ===== */
.pg .muted{ color: var(--pg-muted); }
.pg .border{ border: 1px solid var(--pg-border); border-radius: var(--pg-radius-1); }
.pg .stack > * + *{ margin-top: var(--pg-space-4); }

/* Avoid sticky header overlap for in-page anchors */
[id]{ scroll-margin-top: 72px; }

/* Hover effects only where hover exists */
@media (hover:hover){
  .pg .pg-link:hover::after{ transform: scaleX(1); }
  .pg-btn:hover{ transform: translateY(-1px); box-shadow: var(--pg-shadow-1); }
  .pg-card:hover{ box-shadow: var(--pg-shadow-2); transform: translateY(-2px); }
  .pg-btn--ghost:hover{ background: var(--pg-ink-10); }
  .pg-card:hover .pg-card__media img{ transform: scale(1.06); }
}

/* XL tweaks */
@media (min-width: 1280px){
  .pg-hero__title{ font-size: 60px; }
  .pg .pg-h2{ font-size: 34px; }
}

/* ===== Hero with video background (optional on home) ===== */
.pg-hero--video{
  position: relative;
  overflow: clip;
  padding-block: clamp(72px, 18vh, 220px);
  color: #fff;
}
.pg-hero--video .pg-hero__lead{ color: rgba(255,255,255,.85); }
.pg-hero__bg{ position: absolute; inset: 0; z-index: -1; }
.pg-hero__video,
.pg-hero__bgimg{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.pg-hero__bgimg{ display: none; }
.pg-hero--video::after{
  content:"";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.35));
  z-index: -1;
}
.pg-btn--light{
  background: #ffffff;
  color: #0a0a0a;
  border-color: #ffffff;
}
@media (hover:hover){
  .pg-btn--light:hover{ box-shadow: var(--pg-shadow-1); transform: translateY(-1px); }
}
@media (prefers-reduced-motion: reduce){
  .pg-hero__video{ display: none !important; }
  .pg-hero__bgimg{ display: block !important; }
}

/* ===== Privacy cookies table fix (as before) ===== */
.pg.pg--privacy table.pg-cookies { table-layout: fixed; width: 100%; }
.pg.pg--privacy table.pg-cookies th,
.pg.pg--privacy table.pg-cookies td { word-wrap: break-word; overflow-wrap: anywhere; }
.pg.pg--privacy table.pg-cookies th:nth-child(1),
.pg.pg--privacy table.pg-cookies td:nth-child(1) { width: 18%; }
.pg.pg--privacy table.pg-cookies th:nth-child(2),
.pg.pg--privacy table.pg-cookies td:nth-child(2) { width: 16%; }
.pg.pg--privacy table.pg-cookies th:nth-child(3),
.pg.pg--privacy table.pg-cookies td:nth-child(3) { width: 46%; }
.pg.pg--privacy table.pg-cookies th:nth-child(4),
.pg.pg--privacy table.pg-cookies td:nth-child(4) { width: 12%; }
.pg.pg--privacy table.pg-cookies th:nth-child(5),
.pg.pg--privacy table.pg-cookies td:nth-child(5) { width: 8%; }
.pg.pg--privacy table.pg-cookies td:nth-child(4),
.pg.pg--privacy table.pg-cookies td:nth-child(5),
.pg.pg--privacy table.pg-cookies th:nth-child(4),
.pg.pg--privacy table.pg-cookies th:nth-child(5) {
  text-align: center; white-space: nowrap;
}
@media (max-width: 720px) {
  .pg.pg--privacy .pg-table-wrap { overflow-x: auto; }
  .pg.pg--privacy table.pg-cookies { min-width: 680px; }
}

/* ===== Mobile Hamburger & Curtain Menu (clean) ===== */

/* Burger button (μόνο σε μικρές οθόνες) */
.pg-burger{
  display:none;
  background:none;
  border:0;
  font-size:24px;
  cursor:pointer;
  color:var(--pg-fg);
  width:40px; height:40px; line-height:1;
}
.pg-burger span{
  display:block; width:24px; height:2px; margin:4px 0;
  background:var(--pg-fg); border-radius:2px;
  transition:transform .25s var(--pg-ease), opacity .25s var(--pg-ease);
}

/* Overlay & panel (off-canvas) */
.pg-menu-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,.55);
  opacity:0; pointer-events:none;
  transition:opacity .3s var(--pg-ease);
  z-index:90;
}
.pg-menu-panel{
  position:fixed; top:0; right:0;
  width:100%; max-width:none; height:100%;
  background:var(--pg-bg);
  box-shadow:-2px 0 12px rgba(0,0,0,.2);
  transform:translateX(100%);
  transition:transform .3s var(--pg-ease);
  z-index:100;

  /* κεντραρισμένο περιεχόμενο */
  display:flex; align-items:center; justify-content:center;
  padding: clamp(24px, 6vh, 48px);
}
.pg-menu-panel nav{
  width:100%; max-width:520px;
  display:flex; flex-direction:column; align-items:center; gap:8px;
}
.pg-menu-panel a{
  display:block; width:100%; text-align:center;
  font-size:20px; font-weight:700;
  padding:14px 0; color:var(--pg-fg);
  border-bottom:1px solid var(--pg-border);
}
.pg-menu-panel a:last-child{ border-bottom:0; }

/* Open state */
.pg-menu-open .pg-menu-overlay{ opacity:1; pointer-events:auto; }
.pg-menu-open .pg-menu-panel{ transform:translateX(0); }
.pg-menu-open{ overflow:hidden; } /* κλείδωμα scroll */

/* Header/burger layering ώστε να φαίνεται το Χ πάνω από την κουρτίνα */
.pg-header{ z-index:120; } /* πάνω από overlay(90) & panel(100) */
.pg-menu-open .pg-header{
  background:transparent; border-bottom:0; pointer-events:none; /* δεν μπλοκάρει κλικ */
}
.pg-menu-open .pg-burger{
  position:fixed; top:16px; right:16px;
  z-index:210; background:rgba(255,255,255,.92);
  border-radius:8px; padding:6px; box-shadow:var(--pg-shadow-1);
  pointer-events:auto;
}

/* Burger → Χ animation */
.pg-menu-open .pg-burger span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.pg-menu-open .pg-burger span:nth-child(2){ opacity:0; }
.pg-menu-open .pg-burger span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* Responsive toggle: σε μικρές οθόνες κρύψε το desktop menu & δείξε burger */
@media (max-width:900px){
  .pg-burger{ display:inline-flex; align-items:center; justify-content:center; }
  .pg-nav{ display:none; }
}