/* FikirBaz About / documentary studio layer */
body:has(.fb-about) .elementor-element.onon-inner-page-block:has(.fb-about){padding:0!important}

/* About hero: one cinematic background instead of a separate media card. */
.fb-about-hero{
  background-image:
    linear-gradient(90deg,rgba(5,5,5,.98) 0%,rgba(5,5,5,.9) 30%,rgba(5,5,5,.48) 52%,rgba(5,5,5,.12) 74%,rgba(5,5,5,.18) 100%),
    url("../images/about/fikirbaz-office-gradient-v1.png");
  background-size:cover;
  background-position:center right;
  background-repeat:no-repeat;
}
.fb-about-hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  z-index:-1;
  height:30%;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,var(--fba-black));
}
.fb-about-hero__inner{
  grid-template-columns:minmax(0,760px);
  justify-content:start;
}
.fb-about-hero__copy{max-width:760px}

@media(max-width:800px){
  .fb-about-hero{
    background-image:
      linear-gradient(90deg,rgba(5,5,5,.96),rgba(5,5,5,.78)),
      url("../images/about/fikirbaz-office-gradient-v1.png");
    background-position:62% center;
  }
  .fb-about-hero__inner{display:flex}
}

.fb-about-photo-stage,
.fb-about-story__photo{margin:0}

.fb-about-photo-stage{
  position:relative;
  width:min(46vw,680px);
  height:min(74svh,680px);
  min-height:590px;
  justify-self:end;
  display:grid;
  grid-template-rows:48px minmax(0,1fr) 132px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:28px;
  background:#0d0d0d;
  box-shadow:0 42px 110px rgba(0,0,0,.46),12px 14px 0 rgba(255,40,40,.08);
  isolation:isolate;
}

.fb-about-photo-stage::after{
  content:"";
  position:absolute;
  inset:48px 0 132px;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.02) 48%,rgba(0,0,0,.62) 100%),linear-gradient(90deg,rgba(0,0,0,.2),transparent 30%);
}

.fb-about-photo-stage__bar{
  position:relative;
  z-index:4;
  padding:0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.12);
  color:#817c77;
  font-size:6px;
  font-weight:780;
  letter-spacing:.18em;
}

.fb-about-photo-stage__bar span{display:flex;align-items:center;gap:9px}
.fb-about-photo-stage__bar i{width:6px;height:6px;border-radius:50%;background:#65dc9c;box-shadow:0 0 0 5px rgba(101,220,156,.09)}
.fb-about-photo-stage__bar b{color:#ece9e4;font-size:inherit;font-weight:780}

.fb-about-photo-stage__media{position:relative;min-height:0;overflow:hidden;background:#141414}
.fb-about-photo-stage__scene{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:50% 48%;
  filter:saturate(.82) contrast(1.03) brightness(.88);
  scale:1.01;
  transition:filter .7s ease;
}
.fb-about-photo-stage__wall-sign{
  position:absolute;
  z-index:3;
  left:5.2%;
  top:27%;
  width:27%;
  height:auto;
  opacity:.82;
  transform-origin:left center;
  transform:perspective(760px) rotateY(4deg) rotate(-.6deg);
  filter:brightness(.82) saturate(.9) drop-shadow(0 2px 1px rgba(0,0,0,.88)) drop-shadow(0 0 13px rgba(255,40,40,.08));
}
@media(hover:hover){.fb-about-photo-stage:hover .fb-about-photo-stage__scene{filter:saturate(.91) contrast(1.02) brightness(.91)}}

.fb-about-photo-stage__mark{
  position:absolute;
  right:20px;
  bottom:20px;
  z-index:3;
  display:flex;
  align-items:flex-end;
  gap:10px;
  color:#fff;
  text-align:right;
}
.fb-about-photo-stage__mark i{width:9px;height:9px;margin-bottom:4px;border-radius:50%;background:#ff2828;box-shadow:0 0 0 6px rgba(255,40,40,.17)}
.fb-about-photo-stage__mark b{font-size:8px;font-weight:800;line-height:1.28;letter-spacing:.14em}

.fb-about-photo-stage figcaption{
  position:relative;
  z-index:4;
  padding:20px 22px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px 24px;
  align-content:center;
  border-top:1px solid rgba(255,255,255,.12);
  background:#0d0d0d;
  color:#f5f3ef;
}
.fb-about-photo-stage figcaption span,
.fb-about-photo-stage figcaption small{color:#77716d;font-size:6px;font-weight:760;letter-spacing:.17em}
.fb-about-photo-stage figcaption strong{grid-row:2;color:#f5f3ef;font-size:clamp(21px,1.7vw,27px);font-weight:520;line-height:1.02;letter-spacing:-.045em;text-shadow:0 1px 18px rgba(0,0,0,.3)}
.fb-about-photo-stage figcaption small{grid-column:2;grid-row:1/3;align-self:end;text-align:right}

/* The real working image becomes evidence between belief and principles. */
.fb-about-story__body{
  grid-template-columns:minmax(230px,.62fr) minmax(400px,1.05fr) minmax(340px,.92fr);
  gap:clamp(28px,4vw,68px);
}

.fb-about-story__photo{
  position:relative;
  overflow:hidden;
  min-height:520px;
  border:1px solid rgba(0,0,0,.16);
  border-radius:28px;
  background:#111;
  box-shadow:0 28px 70px rgba(0,0,0,.14),14px 16px 0 rgba(255,40,40,.1);
}
.fb-about-story__photo::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 53%,rgba(0,0,0,.85) 100%);
}
.fb-about-story__photo::after{
  content:"";
  position:absolute;
  z-index:3;
  left:18px;
  top:18px;
  width:26px;
  height:26px;
  border-top:1px solid #ff2828;
  border-left:1px solid #ff2828;
}
.fb-about-story__scene{
  position:relative;
  width:100%;
  height:100%;
  min-height:520px;
  overflow:hidden;
  background:#171513;
}
.fb-about-story__scene-image{
  width:100%;
  height:100%;
  min-height:520px;
  display:block;
  object-fit:cover;
  object-position:52% center;
  filter:saturate(.82) contrast(1.04) brightness(.86);
  transition:transform .9s cubic-bezier(.2,.8,.2,1),filter .5s ease;
}
.fb-about-story__photo:hover .fb-about-story__scene-image{transform:scale(1.025);filter:saturate(.94) contrast(1.02) brightness(.9)}

.fb-about-story__identity{
  position:absolute;
  z-index:4;
  left:20px;
  top:20px;
  width:min(54%,190px);
  padding:12px 13px 10px;
  display:flex;
  flex-direction:column;
  gap:9px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  background:rgba(8,8,8,.74);
  box-shadow:0 14px 30px rgba(0,0,0,.22);
  backdrop-filter:blur(10px);
}
.fb-about-story__identity img{width:100%;height:auto;min-height:0;display:block;filter:none}
.fb-about-story__identity span{color:rgba(255,255,255,.82);font-size:10px;font-weight:760;line-height:1.35;letter-spacing:.1em}

.fb-about-story__proofs{
  position:absolute;
  z-index:4;
  right:16px;
  top:50%;
  width:88px;
  display:grid;
  gap:8px;
  transform:translateY(-43%);
}
.fb-about-story__proofs figure{
  margin:0;
  padding:4px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.17);
  border-radius:12px;
  background:rgba(8,8,8,.76);
  box-shadow:0 12px 25px rgba(0,0,0,.2);
  backdrop-filter:blur(8px);
}
.fb-about-story__proofs img{
  width:100%;
  height:54px;
  min-height:0;
  display:block;
  border-radius:8px;
  object-fit:cover;
  object-position:center;
  filter:saturate(.82) contrast(1.04);
  transition:filter .35s ease,transform .45s cubic-bezier(.16,1,.3,1);
}
.fb-about-story__proofs figcaption{padding:7px 4px 3px;color:#fff;font-size:8px;font-weight:780;letter-spacing:.12em}
@media(hover:hover){.fb-about-story__proofs figure:hover img{transform:scale(1.045);filter:saturate(1) contrast(1.02)}}

.fb-about-story__caption{
  position:absolute;
  z-index:4;
  left:22px;
  right:124px;
  bottom:22px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:9px;
  color:#fff;
  text-shadow:0 2px 24px rgba(0,0,0,.72);
}
.fb-about-story__caption span{color:#ff716d;font-size:8px;font-weight:800;letter-spacing:.18em}
.fb-about-story__caption strong{font-size:clamp(22px,1.7vw,29px);font-weight:560;line-height:1.06;letter-spacing:-.04em}
.fb-about-story__caption small{color:rgba(255,255,255,.82);font-size:8px;font-weight:720;line-height:1.35;letter-spacing:.12em}

@media(max-width:1200px){
  .fb-about-photo-stage{width:min(48vw,610px);min-height:550px}
  .fb-about-story__body{grid-template-columns:minmax(270px,.76fr) minmax(420px,1.24fr);gap:55px}
  .fb-about-story__copy{grid-column:1;grid-row:1}
  .fb-about-story__photo{grid-column:1;grid-row:2;min-height:480px}
  .fb-about-story__scene,.fb-about-story__scene-image{min-height:480px}
  .fb-about-truths{grid-column:2;grid-row:1/3}
}

@media(max-width:800px){
  .fb-about-photo-stage{
    width:100%;
    height:auto;
    min-height:0;
    margin:58px auto 0;
    grid-template-rows:42px auto 118px;
    border-radius:22px;
    box-shadow:0 30px 70px rgba(0,0,0,.4),8px 9px 0 rgba(255,40,40,.08);
  }
  .fb-about-photo-stage::after{inset:42px 0 118px}
  .fb-about-photo-stage__bar{padding-inline:14px;font-size:5px}
  .fb-about-photo-stage__media{aspect-ratio:3/2}
  .fb-about-photo-stage__scene{object-fit:contain;object-position:center;scale:1}
  .fb-about-photo-stage__wall-sign{left:5.2%;top:27%;width:27%}
  .fb-about-photo-stage figcaption{padding:16px;grid-template-columns:1fr}
  .fb-about-photo-stage figcaption strong{grid-column:1;grid-row:2;font-size:21px}
  .fb-about-photo-stage figcaption small{grid-column:1;grid-row:3;text-align:left}
  .fb-about-story__copy p{font-size:15px;line-height:1.72}
  .fb-about-story__body{display:block}
  .fb-about-story__photo{min-height:0;margin:50px 0 0;aspect-ratio:1/1.12;border-radius:22px;box-shadow:0 24px 50px rgba(0,0,0,.12),8px 9px 0 rgba(255,40,40,.1)}
  .fb-about-story__scene,.fb-about-story__scene-image{height:100%;min-height:0}
  .fb-about-story__scene-image{object-position:51% center}
  .fb-about-story__identity{left:14px;top:14px;width:min(54%,174px);padding:10px 11px 9px}
  .fb-about-story__identity span{font-size:9px}
  .fb-about-story__proofs{left:14px;right:14px;top:auto;bottom:132px;width:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;transform:none}
  .fb-about-story__proofs img{height:48px}
  .fb-about-story__proofs figcaption{font-size:7px}
  .fb-about-story__caption{left:18px;right:18px;bottom:18px;gap:7px}
  .fb-about-story__caption span{font-size:7px}
  .fb-about-story__caption strong{font-size:clamp(21px,6.6vw,27px)}
  .fb-about-story__caption small{font-size:7px}
  .fb-about-truths{margin-top:60px}
}

@media(max-width:420px){
  .fb-about-photo-stage{grid-template-rows:40px auto 116px}
  .fb-about-photo-stage::after{inset:40px 0 116px}
  .fb-about-photo-stage__mark{right:14px;bottom:15px}
  .fb-about-photo-stage__mark b{font-size:7px}
}

@media(prefers-reduced-motion:reduce){
  .fb-about-photo-stage__scene,
  .fb-about-story__scene-image,
  .fb-about-story__proofs img{transition:none!important;transform:none!important;scale:1!important}
}
