/*
Theme Name: Hello - BarberShow Ibiza
Description: Child theme for Hello Elementor
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-barbershowibiza
*/


/* === Base normalize (Elementor + WP safe) === */

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

/* Media elements */
img, picture, video, canvas, svg {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Form elements inherit typography */
input, button, textarea, select {
  font: inherit;
}


/* My Custom CSS */
.accent-text {
  color:#E27A3E;
}

.acf-service-list{
  list-style: none;
  margin: 0;
  padding: 0;           /* kills default UL indent */
  padding-left: 0;      /* extra safety */
}

/* ROW */
.acf-service-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  padding:20px 20px;
  margin:0;

  border-bottom: 1px solid rgba(255,255,255,0.10);
  background: transparent;

  transition:
    background 0.25s ease,
    border-color 0.25s ease;
}

/* HOVER */
.acf-service-item:hover{
  background: linear-gradient(
    90deg,
    rgba(197,139,46,0.22) 0%,
    rgba(197,139,46,0.12) 45%,
    rgba(197,139,46,0.04) 100%
  );

  border-bottom: 1px solid #E27A3E;
}

/* TITLE */
.service-title{
  color: rgba(255,255,255,0.92);
  font-weight:600;
  font-size:16px;
  line-height:1.15;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;

  transition: transform 0.2s ease, color 0.25s ease;
}

/* Move title slightly right on hover */
.acf-service-item:hover .service-title{
  transform: translateX(2px);
  color:#ffffff;
}

/* SUBTEXT (no motion, just slight fade) */
.service-subtext{
  margin-top:6px;
  color: rgba(255,255,255,0.55);
  font-weight:400;
  font-size:13px;
  line-height:1.25;

  transition: color 0.25s ease;
}

.acf-service-item:hover .service-subtext{
  color: rgba(255,255,255,0.65);
}

/* PRICE */
.service-price{
  margin:0;
  padding:0;
  line-height:1;

  color:#E27A3E;
  white-space:nowrap;
  flex:0 0 auto;

  font-family: inherit;

  transition: transform 0.2s ease, color 0.25s ease;
}

/* Move price slightly left on hover */
.acf-service-item:hover .service-price{
  transform: translateX(-2px);
  color:#d89b3b;
}


/* ===============================
   TEAM GRID (responsive)
================================= */

.acf-team-grid{
  display:grid;
  grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr));
  gap: 22px;
}

/* Tablet */
@media (max-width: 900px){
  .acf-team-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }
}

/* Mobile */
@media (max-width: 520px){
  .acf-team-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* ===============================
   CARD / MEDIA
================================= */

.acf-team-card{
  margin:0;
}

.acf-team-media{
  position: relative;
  overflow: hidden;
  border-radius: 10px; /* requested */
}

/* Image */
.acf-team-photo{
  width:100%;
  height: 320px;              /* adjust to taste */
  object-fit: cover;
  display:block;
  border-radius: 10px;        /* requested */
}

/* Placeholder if missing */
.acf-team-photo--placeholder{
  width:100%;
  height:320px;
  background: rgba(255,255,255,0.06);
}

/* Slight polish on hover (optional but nice) */
.acf-team-media{
  transition: transform 0.2s ease;
}

.acf-team-media:hover{
  transform: translateY(-2px);
}

/* ===============================
   NAME OVERLAY (Bebas Neue)
================================= */

.acf-team-name{
  position:absolute;
  left: 12px;
  bottom: 12px;

  padding: 8px 12px;
  border-radius: 8px;

  color: rgba(255,255,255,0.95);
  font-size: 22px;
  line-height: 1;
  letter-spacing: 0.6px;
  text-transform: uppercase;

  /* Bebas Neue */
  font-family: "Bebas Neue", sans-serif;

  /* Copper -> transparent */
  background: linear-gradient(
    90deg,
    rgba(226,122,62,0.95) 0%,
    rgba(226,122,62,0.55) 55%,
    rgba(226,122,62,0.00) 100%
  );

  /* Keep it readable on busy photos */
  backdrop-filter: blur(2px);
}

/* Mobile typography */
@media (max-width: 520px){
  .acf-team-photo{
    height: 280px;
  }

  .acf-team-name{
    font-size: 20px;
    left: 10px;
    bottom: 10px;
  }
}



/* Footer compact contact block */
.bsibiza-footer-contact p {
  margin: 0 0 6px;
  font-size: 0.9rem;
  line-height: 1.5;
}

.bsibiza-footer-contact a {
  text-decoration: none;
}


/* Base layout */
.ci {
  font-size: 1rem;
}

.ci-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 14px;
  padding: 10px 0;
}

.ci-label {
  font-size: 0.95rem;
  opacity: 0.7;
  color: #E27A3E;
  font-weight: bold;
}

.ci-value {
  font-size: 0.95rem;
}

/* Hours */
.ci-hours {
  display: grid;
}

.ci-hours-row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 14px;
  padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,0.12);
}

.ci-hours-row:first-child {
  border-top: none;
  padding-top: 0;
}

.ci-day {
  font-weight: 600;
  font-size: 0.95rem;
}

.ci-hours-val {
  font-weight: 400;
  font-size: 0.95rem;
  opacity: 0.9;
}

/* WhatsApp */
.ci-whatsapp {
  text-decoration: none;
  font-size: 0.95rem;
}

/* Mobile */
@media (max-width: 520px) {

  /* Keep main rows stacked (Address / Hours / WhatsApp) */
  .ci-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  /* BUT keep hours inline */
  .ci-hours-row {
    grid-template-columns: 110px 1fr;
    gap: 10px;
  }

}


/* =============================================================
   VIDEO TESTIMONIALS GRID
   ============================================================= */

.acf-video-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.acf-video-item {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* 16:9 responsive wrapper */
.acf-video-embed {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
}

.acf-video-embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.acf-video-label {
  margin: 0;
  font-size: 13px;
  color: rgba(255,255,255,0.55);
  text-align: center;
}

@media (max-width: 768px) {
  .acf-video-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .acf-video-grid { grid-template-columns: 1fr; }
}


/* =============================================================
   COWORKING PAGE
   ============================================================= */

.coworking-page {
  background: #141414;
  color: rgba(255,255,255,0.88);
}

/* ── Shared layout ─────────────────────────────────────────── */
.cw-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 28px;
}

.cw-section {
  padding: 80px 0;
  border-top: 1px solid rgba(255,255,255,0.07);
}

.cw-section__title {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(28px, 4vw, 44px);
  letter-spacing: 1.5px;
  color: #E27A3E;
  margin: 0 0 32px;
  line-height: 1;
}

/* ── CTA Button ────────────────────────────────────────────── */
.coworking-page .cw-btn,
.coworking-page .cw-btn:visited,
.coworking-page .cw-btn:link {
  display: inline-block;
  padding: 14px 34px;
  background: #E27A3E;
  color: #fff !important;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid #E27A3E;
  border-radius: 3px;
  transition: background 0.22s ease, color 0.22s ease;
}

.coworking-page .cw-btn:hover {
  background: transparent;
  color: #E27A3E !important;
}

.coworking-page .cw-btn--large {
  padding: 17px 44px;
  font-size: 15px;
}

/* ── Hero ──────────────────────────────────────────────────── */
.cw-hero {
  padding: 100px 28px 90px;
  text-align: center;
  background: linear-gradient(
    180deg,
    rgba(226,122,62,0.08) 0%,
    rgba(20,20,20,0) 100%
  );
}

.cw-hero__inner {
  max-width: 700px;
  margin: 0 auto;
}

.cw-hero__title {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(52px, 9vw, 96px);
  letter-spacing: 3px;
  line-height: 1;
  color: #fff;
  margin: 0 0 22px;
}

.cw-hero__subtitle {
  font-size: 17px;
  line-height: 1.65;
  color: rgba(255,255,255,0.65);
  margin: 0 0 38px;
}

/* ── Wysiwyg shared ────────────────────────────────────────── */
.cw-wysiwyg {
  font-size: 16px;
  line-height: 1.75;
  color: rgba(255,255,255,0.75);
}

.cw-wysiwyg p { margin: 0 0 1em; }
.cw-wysiwyg ul, .cw-wysiwyg ol { padding-left: 1.4em; margin: 0 0 1em; }
.cw-wysiwyg li { margin-bottom: 0.4em; }
.cw-wysiwyg strong { color: rgba(255,255,255,0.92); }

/* ── Gallery ───────────────────────────────────────────────── */
.cw-gallery__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.cw-gallery__item {
  overflow: hidden;
  border-radius: 6px;
  aspect-ratio: 4/3;
}

.cw-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.35s ease;
}

.cw-gallery__item:hover img {
  transform: scale(1.04);
}

@media (max-width: 768px) {
  .cw-gallery__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .cw-gallery__grid { grid-template-columns: 1fr; }
}

/* ── Features/Highlights ───────────────────────────────────── */
/* Flexbox so an odd last row centres itself rather than leaving a gap */
.cw-features__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

.cw-feature-card {
  flex: 0 1 calc(33.333% - 14px);
  min-width: 220px;
  padding: 28px 24px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.cw-feature-card:hover {
  border-color: rgba(226,122,62,0.4);
  background: rgba(226,122,62,0.05);
}

.cw-feature-card__title {
  font-size: 15px;
  font-weight: 700;
  color: #E27A3E;
  margin: 0 0 10px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.cw-feature-card__desc {
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.65);
  margin: 0;
}

@media (max-width: 768px) {
  .cw-feature-card { flex: 0 1 calc(50% - 10px); }
}

@media (max-width: 520px) {
  .cw-feature-card { flex: 0 1 100%; }
}

/* ── Split layout (conditions / availability) ──────────────── */
.cw-split {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 48px;
  align-items: start;
}

.cw-split .cw-section__title {
  margin-bottom: 0;
}

@media (max-width: 640px) {
  .cw-split {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

/* ── Conditions grid ───────────────────────────────────────── */
.cw-conditions__grid {
  display: grid;
  gap: 0;
}

.cw-conditions__row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 14px;
  padding: 12px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.cw-conditions__row:first-child {
  border-top: none;
  padding-top: 0;
}

.cw-conditions__label {
  font-weight: 600;
  font-size: 0.95rem;
  color: rgba(255,255,255,0.88);
}

.cw-conditions__detail {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.5;
}

.cw-conditions__row--full {
  grid-template-columns: 1fr;
}

.cw-conditions__row--full .cw-conditions__detail {
  color: rgba(255,255,255,0.5);
  font-style: italic;
}

/* ── Availability grid ─────────────────────────────────────── */
.cw-availability__grid {
  display: grid;
  gap: 0;
}

.cw-availability__row {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 14px;
  padding: 9px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.cw-availability__row:first-child {
  border-top: none;
  padding-top: 0;
}

.cw-availability__day {
  font-weight: 600;
  font-size: 0.95rem;
  color: rgba(255,255,255,0.88);
}

.cw-availability__hours {
  font-size: 0.95rem;
  color: rgba(255,255,255,0.65);
}

/* ── Booking CTA ───────────────────────────────────────────── */
.cw-cta {
  border-top: none;
  padding-top: 0;
  padding-bottom: 100px;
}

.cw-cta__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 28px;
}

.cw-cta__label {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(24px, 3.5vw, 38px);
  letter-spacing: 1.5px;
  color: rgba(255,255,255,0.85);
  margin: 0;
}

/* ── Mobile base ───────────────────────────────────────────── */
@media (max-width: 520px) {
  .cw-section { padding: 56px 0; }
  .cw-hero    { padding: 70px 20px 60px; }
}


/* =============================================================
   COWORKING TEASER (homepage shortcode)
   ============================================================= */

.cw-teaser {
  text-align: center;
  padding: 12px 0;
}

.cw-teaser__inner {
  max-width: 680px;
  margin: 0 auto;
  padding: 0 24px;
}

.cw-teaser__label {
  font-size: 11px;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: #E27A3E;
  margin: 0 0 18px;
}

.cw-teaser__title {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(52px, 8vw, 84px);
  letter-spacing: 3px;
  color: #fff;
  margin: 0 0 22px;
  line-height: 1;
}

.cw-teaser__subtitle {
  font-size: 16px;
  line-height: 1.7;
  color: rgba(255,255,255,0.62);
  margin: 0 0 36px;
}

.cw-teaser__actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

.cw-teaser__btn {
  display: inline-block;
  padding: 13px 30px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 3px;
  transition: background 0.22s ease, color 0.22s ease, border-color 0.22s ease;
}

.cw-teaser__btn--solid {
  background: #E27A3E;
  color: #fff !important;
  border: 2px solid #E27A3E;
}

.cw-teaser__btn--solid:hover {
  background: transparent;
  color: #E27A3E !important;
}

.cw-teaser__btn--ghost {
  background: transparent;
  color: rgba(255,255,255,0.8) !important;
  border: 2px solid rgba(255,255,255,0.25);
}

.cw-teaser__btn--ghost:hover {
  border-color: #E27A3E;
  color: #E27A3E !important;
}


/* ── Brand Concept Section ────────────────────────────────────────────────────
   Shortcode: [bsibiza_brand_concept]
   Options page: Brand Identity
   ─────────────────────────────────────────────────────────────────────────── */

.bc-section {
  padding: 90px 0;
}

.bc-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
}

.bc-header {
  text-align: center;
  max-width: 680px;
  margin: 0 auto 64px;
}

.bc-eyebrow {
  font-size: 11px;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: #E27A3E;
  margin: 0 0 20px;
}

.bc-title {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(46px, 7vw, 80px);
  letter-spacing: 2px;
  line-height: 1;
  color: #fff;
  margin: 0 0 24px;
}

.bc-intro {
  font-size: 16px;
  line-height: 1.75;
  color: rgba(255,255,255,0.58);
  margin: 0;
}

.bc-items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 48px 40px;
}

.bc-item {
  text-align: center;
}

.bc-item__icon {
  font-size: 30px;
  line-height: 1;
  margin: 0 0 18px;
}

.bc-item__title {
  font-family: "Bebas Neue", sans-serif;
  font-size: 22px;
  letter-spacing: 1.5px;
  color: #fff;
  margin: 0 0 10px;
}

.bc-item__text {
  font-size: 14px;
  line-height: 1.7;
  color: rgba(255,255,255,0.55);
  margin: 0;
}

@media (max-width: 600px) {
  .bc-section { padding: 60px 0; }
  .bc-header { margin-bottom: 48px; }
  .bc-items {
    grid-template-columns: 1fr 1fr;
    gap: 36px 24px;
  }
}

@media (max-width: 380px) {
  .bc-items { grid-template-columns: 1fr; }
}
