/* ====================================================================
   CONTACT.CSS — Σελίδα Επικοινωνίας
   --------------------------------------------------------------------
   Στήλες/sections (1-προς-1 με το HTML του #page-contact):
     0) .contact-header   — premium masthead (botanical ornaments)
     1) .contact-section  — main grid: form (αριστερά) + info cards (δεξιά)
     2) .contact-faq      — accordion με τις πιο συχνές ερωτήσεις
     3) .contact-signoff  — υπογραφή κλεισίματος
   ==================================================================== */


/* ====================================================================
   0) CONTACT HEADER — editorial 2-col concierge masthead
   --------------------------------------------------------------------
   Layout:
     • Desktop: text (left) + framed editorial photo (right)
     • Mobile : stack — photo πάνω, text κάτω
   ==================================================================== */
.contact-header{
  min-height:560px;
  /* full-bleed bg, constrained content μέσα με μεγάλο side padding */
  padding:5.5rem clamp(3rem, 14vw, 11rem) 5rem;
  max-width:none;border-bottom:none;
  background:
    radial-gradient(55% 75% at 25% 25%, rgba(232,200,176,0.55) 0%, transparent 60%),
    radial-gradient(50% 70% at 80% 78%, rgba(220,200,180,0.40) 0%, transparent 60%),
    linear-gradient(180deg, var(--ivory) 0%, var(--lavender-mist) 100%);
  display:grid;grid-template-columns:1.05fr .85fr;gap:4rem;
  justify-content:center;align-items:center;
  overflow:hidden;position:relative;text-align:left;
}
.contact-header::before{content:none}
.contact-header::after{content:none}

/* 0a) ornaments — μόνο αριστερά για editorial feel (η δεξιά πλευρά έχει την photo) */
.contact-ornament{
  position:absolute;top:50%;transform:translateY(-50%);
  width:240px;height:340px;pointer-events:none;
  opacity:.22;z-index:1;
  background-repeat:no-repeat;background-position:center;background-size:contain;
}
.contact-ornament--left{
  left:-50px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 380' fill='none' stroke='%23b86840' stroke-width='1' stroke-linecap='round'><path d='M40 360 Q 70 240, 110 180 Q 150 110, 130 30' opacity='.7'/><path d='M110 180 Q 70 170, 50 200' opacity='.5'/><path d='M120 130 Q 160 120, 180 100' opacity='.5'/><path d='M125 80 Q 95 70, 75 95' opacity='.45'/><ellipse cx='130' cy='30' rx='14' ry='8' transform='rotate(-25 130 30)' opacity='.55'/><ellipse cx='180' cy='100' rx='14' ry='8' transform='rotate(20 180 100)' opacity='.5'/><ellipse cx='75' cy='95' rx='12' ry='7' transform='rotate(-30 75 95)' opacity='.45'/><ellipse cx='50' cy='200' rx='12' ry='7' transform='rotate(40 50 200)' opacity='.5'/></svg>");
}
.contact-ornament--right{display:none} /* αντικαθίσταται από την photo card */

/* 0b) text column */
.contact-header .page-header-content{
  position:relative;z-index:2;max-width:520px;padding:0;margin:0;
  display:flex;flex-direction:column;align-items:flex-start;text-align:left;
  justify-self:end;
}
.contact-header .eyebrow{margin-bottom:1.6rem;color:var(--gold-leaf)}
.contact-header h1{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.4rem,5vw,4.2rem);
  font-weight:500;line-height:1.04;letter-spacing:-.02em;
  color:var(--aubergine);margin:0 0 1.4rem;
}
.contact-header h1 em{
  font-weight:400;font-style:italic;
  background:linear-gradient(135deg,var(--plum-deep) 0%,var(--gold-leaf) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  padding-right:.06em;
}
.contact-header p{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:1.18rem;line-height:1.6;color:var(--aubergine);opacity:.82;
  max-width:480px;
}

/* 0d) editorial visual — framed polaroid-style photo + caption */
.contact-header-visual{
  position:relative;z-index:2;justify-self:start;
  width:100%;max-width:400px;
  display:flex;flex-direction:column;align-items:center;gap:1.4rem;
}
.contact-header-photo{
  position:relative;width:100%;aspect-ratio:4/5;
  background:linear-gradient(160deg,var(--rose-warm) 0%,var(--lavender-dust) 60%,var(--mauve-soft) 100%);
  box-shadow:
    0 1px 2px rgba(31,24,19,0.06),
    0 30px 70px -20px rgba(31,24,19,0.28),
    0 12px 30px -12px rgba(31,24,19,0.20);
  border:8px solid #fff;border-radius:2px;
  transform:rotate(-2.2deg);
  transition:transform .6s var(--ease-luxe);
}
.contact-header-photo:hover{transform:rotate(-1deg) scale(1.015)}
.contact-header-photo img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(0.95) brightness(1.02);
}
/* warm vignette overlay */
.contact-header-photo::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse at 30% 25%, rgba(253,251,246,0.18) 0%, transparent 55%),
    linear-gradient(180deg, transparent 60%, rgba(31,24,19,0.10) 100%);
}
/* decorative "tape" strips στις γωνίες (washi-tape feel) */
.contact-header-photo-tape{
  position:absolute;width:62px;height:18px;
  background:linear-gradient(180deg, rgba(245,224,200,0.85) 0%, rgba(232,200,176,0.75) 100%);
  box-shadow:0 2px 6px rgba(31,24,19,0.12);
  pointer-events:none;
}
.contact-header-photo-tape--tl{
  top:-14px;left:-18px;transform:rotate(-32deg);
  border-left:1px dashed rgba(31,24,19,0.10);border-right:1px dashed rgba(31,24,19,0.10);
}
.contact-header-photo-tape--br{
  bottom:-12px;right:-16px;transform:rotate(28deg);
  border-left:1px dashed rgba(31,24,19,0.10);border-right:1px dashed rgba(31,24,19,0.10);
}

/* caption κάτω από τη photo — handwritten testimonial feel */
.contact-header-caption{
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  text-align:center;max-width:340px;
}
.contact-header-caption-mark{
  font-size:.9rem;color:var(--gold-leaf);letter-spacing:.4em;opacity:.7;
}
.contact-header-caption p{
  font-family:'Cormorant Garamond',serif !important;font-style:italic;
  font-size:1.05rem !important;line-height:1.4 !important;
  color:var(--plum-deep) !important;opacity:.85 !important;margin:0;max-width:none;
}
.contact-header-caption small{
  font-size:.6rem;letter-spacing:.42em;text-transform:uppercase;
  color:var(--mauve-soft);font-weight:600;opacity:.7;
}


/* ====================================================================
   1) CONTACT SECTION — form (αριστερά) + info cards (δεξιά)
   ==================================================================== */
.contact-section{background:var(--ivory);padding:7rem 3rem 6rem;position:relative}
.contact-section::before{
  content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:1px;height:60px;background:var(--mauve-soft);opacity:.4;
}
.contact-grid{
  max-width:1240px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr;gap:4.5rem;align-items:start;
}

/* 1a) form heading */
.contact-form-head{margin-bottom:2.6rem;max-width:520px}
.contact-form-head .eyebrow{margin-bottom:1rem}
.contact-form-head h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.12;letter-spacing:-.01em;
  color:var(--aubergine);margin:0 0 .9rem;
}
.contact-form-head h2 em{font-style:italic;color:var(--plum-deep)}
.contact-form-sub{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:1.05rem;line-height:1.55;color:var(--ink-soft);
  opacity:.78;margin:0;
}

/* 1b) form shell */
.contact-form{
  background:#fff;
  padding:2.6rem 2.4rem 2.4rem;
  border:1px solid rgba(31,24,19,0.06);
  box-shadow:var(--shadow-card);
  position:relative;
}
.contact-form::before{
  content:'';position:absolute;top:0;left:0;width:80px;height:1px;
  background:var(--gold-leaf);
}

/* 1c) form layout — 2 columns row + stack */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-bottom:0}
.form-row .field{margin-bottom:1.4rem}
.field{display:block;margin-bottom:1.4rem;position:relative}
.field-label{
  display:block;font-size:.64rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--mauve-soft);font-weight:600;margin-bottom:.55rem;
}

/* 1d) inputs */
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form select,
.contact-form textarea{
  width:100%;font-family:'Inter',sans-serif;font-size:.92rem;color:var(--aubergine);
  background:var(--ivory);
  border:1px solid rgba(31,24,19,0.10);
  padding:.95rem 1rem;
  transition:border-color .3s var(--ease-luxe),background .3s var(--ease-luxe),box-shadow .3s var(--ease-luxe);
  border-radius:2px;outline:none;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder{color:var(--mauve-soft);opacity:.7}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  border-color:var(--gold-leaf);background:#fff;
  box-shadow:0 0 0 3px rgba(192,133,122,0.12);
}
.contact-form textarea{resize:vertical;min-height:140px;line-height:1.6;font-family:'Inter',sans-serif}
.contact-form select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6' fill='none' stroke='%239a5d44' stroke-width='1.5' stroke-linecap='round'><path d='M1 1l4 4 4-4'/></svg>");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:10px;
  padding-right:2.4rem;cursor:pointer;
}
/* placeholder option (disabled) — muted styling όταν δεν έχει γίνει επιλογή */
.contact-form select:invalid{color:var(--mauve-soft);opacity:.75}
.contact-form select option[disabled]{color:var(--mauve-soft)}
.contact-form select option{color:var(--aubergine)}

/* 1e) consent checkbox */
.field-check{
  display:flex;align-items:flex-start;gap:.7rem;margin:.4rem 0 1.6rem;
  font-size:.78rem;color:var(--ink-soft);line-height:1.55;cursor:pointer;
}
.field-check input{
  appearance:none;-webkit-appearance:none;
  width:16px;height:16px;flex-shrink:0;margin-top:2px;
  border:1px solid rgba(31,24,19,0.30);
  background:#fff;cursor:pointer;position:relative;border-radius:2px;
  transition:background .25s var(--ease-luxe),border-color .25s var(--ease-luxe);
}
.field-check input:checked{background:var(--gold-leaf);border-color:var(--gold-leaf)}
.field-check input:checked::after{
  content:'';position:absolute;top:1px;left:4px;
  width:5px;height:9px;border:solid #fff;border-width:0 1.5px 1.5px 0;
  transform:rotate(45deg);
}
.field-check a{color:var(--plum-deep);text-decoration:underline;text-underline-offset:2px}
.field-check a:hover{color:var(--gold-leaf)}

/* 1f) submit button — μεγαλύτερο, full-width feel */
.contact-form .btn-primary{width:100%;justify-content:center;padding:1.15rem 2rem}

/* 1g) fine-print κάτω από το κουμπί */
.form-fineprint{
  margin-top:1rem;text-align:center;font-size:.72rem;color:var(--mauve-soft);
  letter-spacing:.04em;
}
.form-fineprint em{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--plum-deep)}


/* ====================================================================
   1B) SIDEBAR — info cards (direct + ωράριο)
   ==================================================================== */
.contact-side{display:flex;flex-direction:column;gap:1.6rem;position:sticky;top:6rem}

/* card shell — light tinted, gold corner accent */
.contact-card{
  background:linear-gradient(160deg, var(--lavender-mist) 0%, var(--lilac-cream) 100%);
  padding:2.2rem 2rem;
  border:1px solid rgba(192,133,122,0.18);
  position:relative;overflow:hidden;
}
.contact-card::before{
  content:'';position:absolute;top:0;right:0;width:60px;height:60px;
  background:
    linear-gradient(135deg, transparent 50%, rgba(192,133,122,0.18) 50%);
}
.contact-card .eyebrow{margin-bottom:.9rem;color:var(--plum-deep)}
.contact-card h3{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:1.5rem;line-height:1.2;color:var(--aubergine);margin:0 0 .7rem;
}
.contact-card h3 em{font-style:italic;color:var(--plum-deep)}
.contact-card-sub{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:1rem;line-height:1.5;color:var(--ink-soft);
  opacity:.78;margin:0 0 1.6rem;
}

/* 1B-a) direct list (email / phone / instagram) */
.contact-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:1.2rem}
.contact-list li{
  display:flex;align-items:center;gap:1rem;
  padding-bottom:1.2rem;border-bottom:1px solid rgba(31,24,19,0.08);
}
.contact-list li:last-child{border-bottom:none;padding-bottom:0}
.contact-row-icon{
  flex-shrink:0;width:42px;height:42px;border-radius:50%;
  background:#fff;border:1px solid rgba(192,133,122,0.30);
  display:flex;align-items:center;justify-content:center;
  color:var(--gold-leaf);transition:all .3s var(--ease-luxe);
}
.contact-list li:hover .contact-row-icon{
  background:var(--gold-leaf);color:#fff;border-color:var(--gold-leaf);
  transform:translateY(-2px);
}
.contact-row-icon svg{width:18px;height:18px}
.contact-row-text{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.contact-row-text small{
  font-size:.62rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--mauve-soft);font-weight:600;
}
.contact-row-text a{
  font-family:'Cormorant Garamond',serif;font-size:1.15rem;
  color:var(--aubergine);text-decoration:none;
  transition:color .3s var(--ease-luxe);font-weight:500;
  word-break:break-word;
}
.contact-row-text a:hover{color:var(--gold-leaf)}

/* 1B-b) ωράριο card */
.contact-card--hours{
  background:linear-gradient(160deg, var(--champagne) 0%, var(--rose-warm) 100%);
}
.hours-list{list-style:none;padding:0;margin:0 0 1.2rem;display:flex;flex-direction:column}
.hours-list li{
  display:flex;justify-content:space-between;align-items:center;
  padding:.85rem 0;border-bottom:1px dashed rgba(31,24,19,0.12);
  font-size:.86rem;
}
.hours-list li:last-child{border-bottom:none}
.hours-list li span:first-child{
  color:var(--aubergine);font-weight:500;letter-spacing:.02em;
}
.hours-list li span:last-child{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  color:var(--plum-deep);font-size:1rem;font-weight:500;
}
.hours-list .closed{color:var(--mauve-soft);opacity:.7}
.hours-note{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:.92rem;color:var(--ink-soft);line-height:1.55;
  padding-top:.6rem;opacity:.85;
}


/* ====================================================================
   3) CONTACT FAQ — accordion
   ==================================================================== */
.contact-faq{background:var(--ivory);padding:7rem 3rem 6rem}
.faq-wrap{max-width:880px;margin:0 auto}
.faq-head{text-align:center;margin-bottom:3.5rem}
.faq-head .eyebrow{margin-bottom:1.2rem}
.faq-head h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:clamp(2rem,3.6vw,3rem);line-height:1.08;
  letter-spacing:-.01em;color:var(--aubergine);margin:0 0 .8rem;
}
.faq-head h2 em{font-style:italic;color:var(--plum-deep)}
.faq-head p{font-size:.98rem;color:var(--ink-soft);opacity:.78;max-width:480px;margin:0 auto}

.faq-list{display:flex;flex-direction:column;gap:.6rem}
.faq-item{
  background:#fff;border:1px solid rgba(31,24,19,0.07);
  transition:all .35s var(--ease-luxe);
}
.faq-item:hover{border-color:rgba(192,133,122,0.25)}
.faq-item[open]{
  background:linear-gradient(180deg, #fff 0%, rgba(245,224,200,0.35) 100%);
  border-color:rgba(192,133,122,0.30);
  box-shadow:var(--shadow-card);
}
.faq-item summary{
  list-style:none;cursor:pointer;
  padding:1.4rem 1.8rem;
  font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:1.18rem;color:var(--aubergine);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  transition:color .3s var(--ease-luxe);
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:'+';flex-shrink:0;
  width:28px;height:28px;border-radius:50%;
  border:1px solid rgba(192,133,122,0.35);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;font-weight:300;color:var(--gold-leaf);
  transition:all .35s var(--ease-luxe);font-family:'Inter',sans-serif;
}
.faq-item[open] summary::after{
  content:'−';background:var(--gold-leaf);color:#fff;
  border-color:var(--gold-leaf);transform:rotate(180deg);
}
.faq-item summary:hover{color:var(--plum-deep)}
.faq-item p{
  padding:0 1.8rem 1.6rem;font-size:.96rem;color:var(--ink-soft);
  line-height:1.75;opacity:.88;margin:0;
}
.faq-item p a{
  color:var(--plum-deep);text-decoration:underline;text-underline-offset:3px;
  cursor:pointer;
}
.faq-item p a:hover{color:var(--gold-leaf)}


/* ====================================================================
   4) CONTACT SIGNOFF — υπογραφή κλεισίματος
   ==================================================================== */
.contact-signoff{
  background:linear-gradient(180deg, var(--ivory) 0%, var(--lavender-mist) 100%);
  padding:5rem 3rem 7rem;text-align:center;position:relative;
}
.contact-signoff::before{
  content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:1px;height:50px;background:var(--mauve-soft);opacity:.4;
}
.signoff-content{max-width:520px;margin:0 auto}
.signoff-line{
  font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:1.3rem;color:var(--plum-deep);margin:0 0 .5rem;
}
.signoff-name{
  font-family:'Cormorant Garamond',serif;font-weight:400;
  font-size:2rem;color:var(--aubergine);line-height:1.2;margin:0;
}
.signoff-name em{font-style:italic;color:var(--plum-deep);letter-spacing:.02em}
.signoff-rule{width:80px;height:1px;background:var(--mauve-soft);margin:2rem auto 0;opacity:.55}


/* ====================================================================
   5) RESPONSIVE — tablet & mobile
   ==================================================================== */
@media(max-width:968px){
  .contact-header{
    min-height:auto;padding:3rem 1.5rem 4rem;
    grid-template-columns:1fr;gap:3.6rem;text-align:center;   /* περισσότερος αέρας photo↔κείμενο */
  }
  .contact-ornament{display:none}
  .contact-header .page-header-content{
    padding:0;align-items:center;text-align:center;max-width:100%;
    order:2;
  }
  .contact-header .eyebrow{margin-bottom:1.1rem}
  .contact-header h1{margin-bottom:1.1rem}
  .contact-header h1 br{display:none}
  .contact-header p{max-width:100%}
  .contact-header-visual{
    order:1;max-width:280px;margin:0 auto;justify-self:center;gap:1.6rem;
  }
  .contact-header-photo{transform:rotate(-1.6deg)}
  /* caption: ξεκολλάει το ✦ / quote / «promise» */
  .contact-header-caption{gap:.9rem}
  .contact-header-caption p{font-size:.98rem !important;line-height:1.5 !important}
  .contact-header-caption small{margin-top:.2rem}
  .contact-section{padding:4.5rem 1.5rem 4rem}
  .contact-grid{grid-template-columns:1fr;gap:2.6rem}
  .contact-side{position:static;top:auto}
  .contact-form{padding:2rem 1.6rem}
  .form-row{grid-template-columns:1fr;gap:0;margin-bottom:0}
  .contact-faq{padding:4.5rem 1.5rem}
  .faq-item summary{padding:1.2rem 1.4rem;font-size:1.05rem}
  .faq-item p{padding:0 1.4rem 1.4rem;font-size:.92rem}
  .contact-signoff{padding:4rem 1.5rem 5rem}
}